misterunknown: Horizontale Navigationsleiste zentrieren

Beitrag lesen

Moin,

Nachvollziehen kann ich es aber ich verstehe trotzdem nicht wie ich einzelne Elemente verschiebe bzw. zentriere. position:center funktioniert ja leider nicht.

Du hast einen #wrapper und eine #navigation. Beide werden vom Browser per default als 100% angesehen. Diese zu zentrieren geht nicht, da 100% schon mittig sind. Innerhalb deiner Navigation sind zwei unabhängige Listen. Einzeln könnte man die zentrieren, allerdings sieht das unschön aus.

Lösung: Gebe dem #navigations-Div einfach eine feste Breite (beispielsweise 305px) und setze margin:auto;. Dann wird die Navigation zentriert angezeigt.

Hier ist ein Online-Beispiel, in dem ich dem Wrapper als auch der Navigation einen kleinen Rahmen zum besseren Verständnis gegeben habe.

Hinweis: Mit den Developer-Tools von Google Chrome oder Firefox kann man sehr gut sehen, wie die Seite aufgebaut ist und eventuelle Fehler erkennen. Außerdem kann man direkt in HTML, CSS und Javascript schreiben und live die Änderungen mitverfolgen.

Grüße Marco