probleme bei meinem neuen layout mit <div>
jensi
- css
hallo!
ich mache gerade eine website und erstelle dafür das gerüst. ich möchte einen header haben, dann ein menü (auf der rechten seite), einen inhaltsberech (rechts) und am schluss einen footer.
das mit dem header und footer klappt gut, aber probleme hab ich bei inhalt und menü. ich möchte, dass das menü auf der linken seite so groß ist wie der längste eintrag und dass der inhalt den restlichen platz einnimmt. das mache ich, indem ich der navigation ein float:left gebe. allerdings gebe ich nicht (so wie hier in selfhtml im beispiel) eine meindestbreite an.
und dann passiert das, was ich nicht will: wenn das menü auf der linken seite vertikal größer ist als der inhalt, dann ist der inhalt plötzlich zentriert. das sieht dann so aus:
-------------------------------
| header |
-------------------------------
________
| |
| navi |
| menü1|______________________
| menü2| zeile1 |
| menü3| zeile2 |
| menü4| zeile3 |
| menü5| zeile4 |
| menü6| zeile5 |
| menü7|______________________|
| menü8|
| menü9|
|______|
-------------------------------
| footer |
-------------------------------
ich hätte es aber lieber so:
-------------------------------
| header |
-------------------------------
______ _____________________
| || zeile1 |
| navi || zeile2 |
| menü1|| zeile3 |
| menü2|| zeile4 |
| menü3|| zeile5 |
| menü4||_____________________|
| menü5|
| menü6|
| menü7|
| menü8|
| menü9|
______
-------------------------------
| footer |
-------------------------------
könnt ihr mir dabei helfen?
so sieht der quelltext aus:~~~html
<div id="header" style="background:lime;">
header
</div>
<div id="menü" style="float:left; background:red;">
<ul>
<li>ganz</li>
<li>viele</li>
<li>menüpunkte</li>
</ul>
</div>
<div id="inhalt" style="background:green;">
inhalt inhalt inhalt
</div>
<div id="footer" style="background:green;">
footer
</div>
PS: das css ist jetzt nur zum demonstrieren da. nacher tu ich das in eine eigene datei und auch die farben sind nur zum verdeutlichen.
bitte helft mir dabei! danke!
[latex]Mae govannen![/latex]
könnt ihr mir dabei helfen?
Bin gerade etwas eilig, daher ohne selber zu testen:
Da die Navi gefloatetet ist, brauchts wohl danach ein clear
Cü,
Kai
Hallo,
und dann passiert das, was ich nicht will: wenn das menü auf der linken seite vertikal größer ist als der inhalt, dann ist der inhalt plötzlich zentriert. das sieht dann so aus:
Wie schon von Kai345 erwähnt, scheint ein clear
zu helfen.
Z.B.: <div id="footer" style="background:green;clear:left"
Allerdings habe ich mal den Code ausprobiert, dabei rutscht hier der footer
hoch, und "zentriert" schaut das nicht aus. Mit welchem Browser sieht es
eigentlich aus wie von dir beschrieben (oder lag es an etwas anderem Code)?
Grüsse aus Düsseldorf
Cyx23