Menüzeile verrutscht beim Zoomen

html.de-Forum HTML, XHTML & CSS
1

Hallo Leute,

ich habe folgendes Problem: Ich benutze ein horizontales Menü, das die gesamte
Breite des Dokuments ausfüllt (div, 900px). Wenn man mit „Strg und -“ herauszoomt,
rutscht der letzte Menüpunkt („Kontakt“) eine Zeile runter - jedenfalls bei den meisten
Browsern. Was kann ich dagegen tun?

Hier der CSS Code:

ul.navi {
text-decoration: none;
text-align:center;
position:relative;
top:0px;
left:-40px;
width:100%;
margin:0 auto;
overflow:visible;}

ul.navi li {
display:inline;
padding-top:13px;
padding-bottom:13px;
float:left;
color:white;
margin-left:0;
margin-top:0;
background-color:#1E3882;}

ul.navi li.home {
color:white; width:23%; background-color:#238000; border-right: solid 1px black;}

ul.navi li.bildungsangebote {
width:23%; border-right: solid 1px black;}

ul.navi li.vita {
width:17.5%; border-right: solid 1px black;}

ul.navi li.referenzen {
width:18%; border-right: solid 1px black;}

ul.navi li.kontakt {
width:18%;}

Vielen Dank!
Malte

2

Gib ul.navi noch eine Mindestbreite in Pixeln, nicht in Prozent.

Und verwende bitte Code-Tags, wenn Du Quellcode hier im Forum zeigst.

3

Danke für die Antwort! Ich habe jetzt statt „width:100%“ geschrieben „min-width:900px“ -
ansonsten stimmt halt die Breite der Menüzeile nichtmehr. Aber der Punkt „Kontakte“ rutscht
beim Zoomen immer noch runter.
Ich merke allerdings gerade, dass das nurnoch beim Firefox passiert. Beim IE und Chrome
nicht mehr.