Come centrare una barra di navigazione con CSS o HTML?
Domanda
Ho difficoltà a centrare la barra di navigazione questa pagina.
Provai nav { margin: 0 auto; }
E un sacco di altri modi, ma non riesco ancora a centrarlo.
Soluzione
#nav ul {
display: inline-block;
list-style-type: none;
}
Dovrebbe funzionare, l'ho testato nel tuo sito.
Altri suggerimenti
Aggiungi alcuni CSS:
div#nav{
text-align: center;
}
div#nav ul{
display: inline-block;
}
Se hai la tua navigazione <ul>
con la classe #nav allora devi metterlo <ul>
Articolo all'interno di un contenitore di div. Rendi il tuo contenitore Div la larghezza del 100%. e impostare il text-align: Element su Center nel contenitore Div. Allora nel tuo <ul>
Impostare quella classe per avere 3 elementi particolari: align: Centro; Posizione: relativo; e display: blocco inline;
che dovrebbe centrarlo.
Il modo migliore per risolverlo ho cercato il codice o trucco come centrare il menu nav e ho trovato le soluzioni reali che funziona per tutti i browser e per i miei amici;)
Ecco come ho fatto:
body {
margin: 0;
padding: 0;
}
div maincontainer {
margin: 0 auto;
width: ___px;
text-align: center;
}
ul {
margin: 0;
padding: 0;
}
ul li {
margin-left: auto;
margin-right: auto;
}
e non dimenticare di impostare doctype html5
Tuo nav
div
è effettivamente centrato correttamente. Ma il ul
dentro non lo è. Dai il ul
una larghezza e un centro specifici anche quello.
Puoi anche usare il float e il blocco in linea per centrare il tuo nav come il seguente:
nav li {
float: left;
}
nav {
display: inline-block;
}