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.

È stato utile?

Soluzione

#nav ul {
    display: inline-block;
    list-style-type: none;
}

Dovrebbe funzionare, l'ho testato nel tuo sito.

enter image description here

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;
}
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top