eine float:left Liste mit subnavigation zentrieren

Ich habe eine ganze Weile gesucht und schließlich bei CSSplay die Lösung gefunden.

Man umschließt die betreffende Navigation mit einem div (in meinem Fall mit der Klasse „container“), dem man folgende Eigenschaften zuweist:

.container { clear:both; float:left; width:100%;}

Der Liste gibt man folgende Eigenschaften:

#menu2 {
	float:left;
	position:relative; 
	left:50%;
}
#menu2 li {
	float:left; position:relative; right:50%; 
}

Und damit steht die Liste auch schon in der mitte. Einziges Problem ist, dass man dauerhaft eine scrollbar hat, aber die kann man im Normalfall ja sehr einfach deaktivieren:

body{overflow-x:hidden;}

Das ganze Beispiel ansehen.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.