Wenn ich die Seite verkleinere, verschwinden meine Menüunterpunkte hinter dem Text. Die Navigation ist mit overflow:visible ausgezeichnet
Gut, das ist der Standardwert.
hat eine Breiten- und Höhenangabe
Warum eine Höhenangabe? Ich hätte die Höhe dynamisch gelassen und stattdessen Abstände definiert.
#navi {
overflow : visible;
min-height : 1em;
}
Versuche hier mal das Gegenteil: overflow:hidden;
Das führt dazu, dass das Element so hoch ist, wie alle floatenden Boxen darin es erfordern - sprich, es werden alle float-Boxen eingeschlossen werden.
Hintergrund: overflow:hidden erzeugt einen Block Formatting Context bzw. ein Element mit hasLayout im IE. Diese Eigenschaften sind für den Effekt verantwortlich.
http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#wunderwaffe-overflow
http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#internet-explorer
#navi li, #navi li a {
line-height : 1.2em;
display : inline;
float : left;
}
Hat es einen Grund, warum du beiden display:inline *und* float:left gibst?
Üblicherweise sind das zwei verschiedene Möglichkeiten für eine horizontale Navigation - entweder bekommen die lis display:inline, wodurch eine Darstellung in einer Zeile schon gegeben ist, oder sie bleiben auf display:list-item und man floatet sie. Die a-Elemente haben ohnehin display:inline und man gibt ihnen ab und zu höchstens display:block.
Mathias