nicht angemeldet
Hallo ihr,
eigentlich ist das doch so einfach, was ich vorhabe, aber irgendwie habe ich mich inzwischen total verstrickt. Vielleicht seid ihr so nett und helft mir ein wenig beim Entwirren.
So soll es sein:
-------------1-------------- | ---------2------------ | | | | | | ---------------------- | | | | --3-- -------4------- | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | ----- --------------- | | ----------5----------- | | | | | | ---------------------- |
1 ist die Ebene, auf der alle anderen liegen. Sie soll mittig ausgerichtet werden. Dazu habe ich notiert:
#alles { text-align:center; margin-left:auto; border-left-width:0px; padding-left:0px; width:775px; padding-right:0px; border-right-width:0px; margin-right:auto; }
Problem: Mozilla zentriert, IE nicht.
2 ist die Kopfzeile und funktioniert so weit. Gleiches gilt für die Fußzeile 5.
3 soll das linke Menue werden und 4 der Textbereich. Im HTML-Quellcode nacheinander notiert:
<div id="Kapitelmenue">Menue</div> <div id="Textbereich">Inhalt</div>
werden diese Ebenen ja zunächst nacheinander angezeigt, also statt so:
--3-- -------4------- | | | | | | | | | | | | ----- ---------------
so:
--3-- | | | | | | ----- -------4------- | | | | | | | | | | | | | | ----------------
Um sie immerhin schon einmal vertikal richtig zu positionieren, notierte ich:
#Kapitelmenue {position:relative; width:200px;} #Textbereich {position:relative; width:575px; left:200px;}
Das sieht dann so aus: --3-- | | | | ----- ------4--------- | | | | | | | | | | | | ----------------
Mozilla macht es, IE produziert absoluten Müll:
-------------1-------------- | ---------2------------ | | | | | | ---------------------- | | | | ---3-- | | | | | | | | | | | | | | | | | | ------ | | -----------------4-------------- | | | | | | | | | | | | | -----------------4-------------- | | | ----------5----------- | | | | | | ---------------------- |
position:absolute; würde sich jedoch am body-Rand orientieren, also aus der Ebene 1 herausfallen. Auch keine Lösung.
Ergänze ich #Textbereich um top:-15px; (Wobei -15 nur ein ca-Wert ist, der ändert sich auch dauernd.), stehen die beiden Bereiche schließlich auch horizontal nebeneinander, diesmal auch im IE. (Natürlich weiterhin mit der vertikalen Verschiebung im IE.)
Aber: Fülle ich 3 mit viel Text und 4 mit wenig, sieht es so aus:
--3-- | | | | | | ----------4----------- | | | | | | | | ----- ----------------------
Fülle ich 4 mit viel Text und 3 mit wenig, sieht es so aus:
---3-- ----------4----------- | | | | | | | | ------ | | | | | | | | ----------------------
Auch hier sowohl im Mozilla als auch IE.
Meine Angaben für die beiden Ebenen:
#Kapitelmenue { position:relative; width:200px; text-align:left; vertical-align:top; font-family:arial, helvetica, sans-serif; font-size:12px; color:#000000; }
#Textbereich { position:relative; top:-19px; left:200px; width:575px; text-align:left; vertical-align:top; text-decoration:none; font-family:arial, helvetica, sans-serif; font-size:12px; color:#000000; }
Es könnten Tippfehler sein oder falsch verstandene Angaben oder fehlende Angaben oder generelle Darstellungsprobleme der Browser, gegen die man nichts machen kann, oder... Wahrscheinlich ist es von jedem etwas, nur habe ich inzwischen keine Ahnung mehr, wo ich ansetzen soll.
Ist jemand so nett und hilft mir?
Grüße, Conny