Dynamisch Navigationsleiste zentrieren

[Detlef G.]

Hallo Jens,

welche Variante möchtest du denn nun?
<http://de.selfhtml.org/css/layouts/anzeige/nav_modern.htm@title=Die mit den Untermenüs> nur zentriert?
Dort das CSS ändern:

  div#Rahmen {  
 /* width: 47.1em;  entfernt, ul#Navigation braucht die Breitenangabe */  
    padding: 0.8em;  
    border: 1px solid black;  
    background-color: silver;  
    text-align: center;  /* hinzugefügt weil alte IEs nicht mit margin:0 zentrieren */  
	}  
/* * html div#Rahmen {  /* Korrektur fuer IE 5.x - entfernt weil Breite jetzt in ul#Navagation  
    width: 48.7em;  
    w\idth: 47.1em;  
  } */  
  div#Rahmen div {  
     clear: left;  
  }  
  ul#Navigation {  
/*  margin: 0;   stattdessen zentrieren */  
    margin: auto;  
	width: 47.1em;  
	padding: 0;  
/*  text-align: center;  hier nicht mehr nötig, weil schon in div#Rahmen */  
  }  
  * html ul#Navigation {  /* Korrektur fuer IE 5.x  - hier hinzugefügt*/  
    width: 48.7em;  
    w\idth: 47.1em;  
  }  

Dann sollte es passen.

Geht das überhaupt was ich will?

• Gleichgroße Buttons

Kein Problem, wenn du ihnen eine Breite gibst.

• Hover-Effekt

Kein Problem, wenn du die entsprechende Pseudoklasse richtig verwendest.

• Zentriert

Indem der ul margin:auto und eine passenden Breite gibst (und dem Elternelement text-align:center für unfähige Browser).
Zentriert nebeneinander stellen wäre wohl auch mit inline-block möglich, wie sich dies allerdings für (dynamische) Menüs gebrauchen lässt, habe ich aber noch nie getestet.

• Untermenüs beim Hover wären toll

Das kennst du doch bereits: Dynamische CSS-Navigation für moderne Browser (bitte auch weiterlesen)

Auf Wiederlesen
Detlef