mettere al centro i bottoni

paperinik4 · 2015-08-25T12:14:34+0200

Salve a tutti,

Vorrei sapere il perchè non riesco a mettere al centro i bottoni che ho creato stanno tutti allineati come devono stare al bordo dello scermo con padding: 0,5px; pero se metto un:

HTML:

<div align ="center">

Non cambiano la loro posizione. Vi mostro il codice per intero e uno schizzo di dove dovrebbero stare.

Questo è il codice:

PHP:

<!DOCTYPE html>

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
                <link rel="stylesheet" href="aggiungi.css">
 <style type="text/css">
#intestazione{
 width:100%;
 height:100px;
 position:absolute;
 font-family: Comic Sans MS;
 top:0px;
 left:0px;
 text-align: center;
}
 #divhr {
    
position:absolute;
top: 105px;    
font-family:Comic Sans MS;
}


        #footer
{
    position: fixed;
    bottom: 0;
    left: 0;
    text-align: center;
    background: white;
    color: black;
    font-family: Comic Sans MS;
    font-size: 15px;
    width: 100%;
   /* padding: 5px 0;*/
    opacity: 0.9;
    -moz-opacity: 0.9;
    filter: alpha(opacity=90);
}

   /* Aggiungi*/

.bottone {

	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	
	-moz-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 2px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 2px 2px rgba(0,0,0,0.2);
	box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 2px 2px rgba(0,0,0,0.2);
	
	border: 1px solid;
	padding: 1px 12px;
	color: #fff;
	font-family: "Comic Sans MS";
	font-size: 1.4em;
	font-weight: bold;
	text-shadow: -1px -1px rgba(0,0,0,0.1), 0 0 15px rgba(255,255,255,0.75);
	white-space: nowrap;
	
	background: #777;
	border-color: #777;
	
	text-decoration: none;
	font-style: normal;
	text-transform: none;
	
	
}
.bottone:hover,
.bottone:focus {
	position: relative;
	bottom: 1px;

	-moz-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 3px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 3px 2px rgba(0,0,0,0.2);
	box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 3px 2px rgba(0,0,0,0.2);
}	

.ClasseDelDiv{
display:inline;
margin : 33%;

}

</style>


    </head>
    <header>
            
       <div id = "intestazione">
            <h1>Gestione iscrizione prova</h1>
            <hr>
            </div>
            
        <div id = "divhr">
            
    </header> 
    
    <body> 
        
 <!--<form action= 'aggiungi.php' method="POST">-->

   <div id ="divhr">

         <div align="center">	
<div class="divBottoni">


<a href="aggiungi.php" class="bottone orange">Aggiungi</a>
<a href="cancella.php" class="bottone orange">Cancella</a>
 <a href="modifica.php" class="bottone orange">Modifica</a>
 <a href="riccerca.php" class="bottone orange">Ricerca</a>

        </div> </div>  
       
        
        <footer>
            <div id ="footer">
                <hr>
                <h1>Questa è una prova del footer fondo pagina</h1>
                </hr>
            </div>
        </div>
        </footer>
        <?php
        require_once "connetticonxampp.php";
        require_once "data.php";
        echo "</hr>";
        ?>
    </body>
</html>

E ora lo schizzo. Come potete vedere dovrebbero essere posizionate dall'inizio della prima "X" alla fine della seconda "X". Ho fatto duecento prove ma senza ottenere un risultato. Spero che qualcuno mi possa aiutare. Grazie.

n1k4r0 · 2015-08-25T14:04:09+0200

hai messo il div con id divhr in position absolute, questo fa sì che la sua larghezza sia pari a quella del suo contenuto se non diversamente specificato quindi che tu allinei a sinistra, destra o centro il risultato sarà sempre uguale a quello che vedi adesso perché quel div è largo come la somma dei bottoni.
per fare quello che vuoi tu devi dare al div divhr la larghezza al 100%.

paperinik4 · 2015-08-25T14:17:49+0200

Ciao n1k4r0,

Grazie della risposta. Da questo attuale:

PHP:

#divhr {
    
position:absolute;
top: 105px;    
font-family:Comic Sans MS;
}

inquesto modo qua

#divhr {

position:absolute;
top: 100px;
font-family:Comic Sans MS;
}

Giusto ????

n1k4r0 · 2015-08-25T14:22:15+0200

no devi fare così

Codice:

#divhr {
    
position:absolute;
top: 105px;    
font-family:Comic Sans MS;
width: 100%;
}

paperinik4 · 2015-08-25T14:24:28+0200

Ciao n1k4r0,

Finalmente ci sono riuscito. Solo che c'è da sistemare un ultima cosa. La data si è spostata verso il basso, invece deve stare allineata alla scritta "gestione iscrizione prova". Questo che ti allego è lo screenshot. E questo è come l'ho sistemato:

PHP:

 #divhr {
    
position:relative;
top: 105px;    
font-family:Comic Sans MS;
}

Come si può risolvere ??? Grazie ancora.

n1k4r0 · 2015-08-25T14:31:43+0200

io in locale non posso includere il file data.php, per capirci qualcosa dovrei vedere la pagina, è online? si può vedere?

paperinik4 · 2015-08-25T14:39:31+0200

No sta tutto sul nas e quindi inaccessibile. Proverò nel pomeriggio a metterlo su insito di altervista. Considera che non deve andare online. per il momento.

paperinik4 · 2015-08-25T20:15:49+0200

Ciao n1k4r0,

Allora ho generato un nuovo sito in modo tale che puoi trantillamente vedere online. Ma ci vorrà almeno 48 ore (spero prima) chre si possa visualizzare. Ti do l'indirizzo appena è visibile. Grazie ancora.

n1k4r0 · 2015-08-25T23:33:47+0200

d'accordo, mi permetto però alcune considerazioni. guardando il tuo codice noto delle cose che mi lasciano perplesso, immagino che tu sia alle prime armi ma sembra che tu abbia copiato e incollato senza chiederti a cosa servano i vari pezzi.

hai messo il tag header prima del tag body, è sbagliato, BODY è il contenitore generale che deve contenere tutto quello che appare nella pagina. fuori di esso, allo stesso livello, dovrebbe esserci soltanto HEAD.

ci sono un sacco di div con la position absolute, questo non è un vero e proprio errore però la position absolute dovrebbe essere l'ultima risorsa nel css quando tutte le altre soluzioni hanno fallito, ma nel codice c'è il div contenuto nel header con la posizione assoluta mettendolo in alto a sinistra, cosa che il primo elemento della pagina fa già da solo senza bisogno della posizione assoluta.

hai incluso il file data.php alla fine del codice quando, se ho capito bene, la data appare come primo elemento della pagina, allora perché non includerlo dove dovrebbe essere?

secondo me dovresti studiare un pochino, so che html e css sembrano essere semplici e in effetti lo sono ma ci sono delle procedure e delle regole che vanno imparate e utilizzate altrimenti il codice diventa ingestibile, incomprensibile e non mantenibile oltre a far diventare il debug di eventuali errori molto complicato. su internet è pieno di tutorial gratuiti su come scrivere html, come implementare i fogli di stile, come programmare in javascript e come farlo in php, approfittane e diventerà tutto più facile.

detto questo se riesci a mettere la pagina online ci darò un'occhiata sperando di capire cosa non vada

paperinik4 · 2015-08-25T23:46:35+0200

Grazie dei consigli. Domani spero che sia già pronto e ti mando il link. Per adesso ti auguro una buona serata e una buona notte.

paperinik4 · 2015-08-26T17:29:34+0200

Ciao n1k4r0,

Se hai fatto caso è un file a parte la data richiamato con require_once. Quindi secondo te dovrei metterlo n questa maniera qua se non ho capito male:

PHP:

<!DOCTYPE html>
<?php

require_once "data.php";
?>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
      


  <?php
require_once"connettimysqli.php";

        ?>
    </body>
</html>

Se è così mi hanno detto che non è una pagina pulita non se è vero o meno ovviamente.

Cerca

Cerca

mettere al centro i bottoni

paperinik4

Utente Attivo

Allegati

n1k4r0

Utente Attivo

paperinik4

Utente Attivo

n1k4r0

Utente Attivo

paperinik4

Utente Attivo

Allegati

n1k4r0

Utente Attivo

paperinik4

Utente Attivo

paperinik4

Utente Attivo

n1k4r0

Utente Attivo

paperinik4

Utente Attivo

paperinik4

Utente Attivo

Discussioni simili