Wie zentriere ich Nav mit CSS/HTML?

-2

Ich bin auf der Suche nach Hilfe meiner Navigationsleiste auf meiner Website Meridian Ridge

ich durchaus ein paar dieser Fragen habe gesucht zu zentrieren, die dies bereits gefragt und versucht, was sie wie der Verwendung von Display sagten: inline & margin: 0 auto, aber nichts, was ich tun scheintWie zentriere ich Nav mit CSS/HTML?

Quelle

2016-07-13 sararaveis

Auch von @Isabel Inc gezeigt, erfordert Rand Auto eine feste Breite. Ich bevorzuge Flex, weil Sie eine Perzentilbreite haben können. – Manatax

Willkommen bei Stack Overflow! Fragen, die Code-Hilfe suchen, müssen den kürzesten Code enthalten, der für die Reproduktion in der Frage selbst erforderlich ist **. Obwohl Sie einen [** Link zu einer Site oder einem Beispiel **] angegeben haben (http://meta.stackoverflow.com/questions/254428/something-in-my-web-site-or-project-doesnt-work) Wenn Sie die Verknüpfung ungültig machen möchten, ist Ihre Frage für andere zukünftige SO-Benutzer mit demselben Problem nicht von Bedeutung. –

@Manatax Vielen Dank für die Erklärung, dass ich eine feste mit Rand Auto verwendet haben musste! – sararaveis

#header-right-section { 
    text-align: center; 
} 

.main-navigation { 
    display: inline-block; 
}

Quelle

2016-07-13 18:06:09 Matt

Versuchen Sie, diese

#menu-meridian-ridge{ 
margin: 0 auto; 
width: 700px; 
}

Sie eine Breite angeben müssen zu arbeiten, die nicht automatisch für Marge 0 auto zur Arbeit

Quelle

2016-07-13 18:06:56

Oder Sie können dies auch nutzen:

#menu-meridian-ridge { 
    display: flex; 
    justify-content: space-around; 
}

Quelle

2016-07-13 18:07:51 Manatax

Ich mag das @Manatax. Es ist einfach und einfach. Das einzige Problem ist, wenn Sie sich zB um Unterstützung kümmern. –

IE 11 hat etwas Unterstützung, aber IE ist endlich verblasst mit Microsoft Windows 10 mit der Kante schieben;) Die Tage der IE-Unterstützung sind glücklich zu Ende. – Manatax

Ja, ich kann dem nicht zustimmen. Aber es gibt immer noch viele Leute da draußen, die alte Versionen von IE benutzen. Hoffentlich wird bald alles Standard sein :) –

Die CodePen unten verlinkt war eine Antwort auf eine andere navigationsbezogene Frage, aber es nutzt display:inline-block ein Zentrum ausgerichtete Navigationsstruktur zu erreichen, und Sie sollten eine Grundlage bieten lernen, wie man diesen Stil am besten erreicht.

http://codepen.io/rkieru/pen/JKyYpx

.navbar { 
    list-style: none; 
    margin: 0 auto; 
    padding: 0 0 4px 0; 
    text-align: center; 
} 

.navbar li { 
    display: inline-block; 
    margin: 5px 0; 
} 

.navbar a { 
    display: block; 
    padding: 0 15px; 
}

Quelle

2016-07-13 18:10:57

Was auch immer Element, das Sie für Ihre Navigation einfach bestimmen, wie weit Sie es sein wollen.

div.navigation { 
    width:992px; 
    margin-left:auto; 
    margin-right:auto; 
}

Quelle

2016-07-13 18:11:47 HisPowerLevelIsOver9000

Wie zentriere ich Nav mit CSS/HTML?

Antwort

Verwandte Themen