✔ [Layout mit relativer Positionierung und clear-left] Opera/IE richtig, Firefox falsch

[Thomas D]

Hallo!

Beim folgenden CSS-Layout wird die Seite mit Opera und IE 7 korrekt aufgebaut, wohingehend Firefox sich bemüßigt fühlt, den Content-Bereich falsch auszulegen (s. nachstehende Graphiken). Woran kann das liegen

#mainDiv
{
    width: 1000px;
    margin: 0 auto;
}

#headFrame
{
    width: 760px;
    height: 80px;
}

#leftFrame
{
    width: 210px;
    height: 470px;
    float: left;
    overflow: hidden;
}

#content
{
    position: relative;
    width: 544px;
}

#footer
{
    height: 30px;
    width: 760px;
    clear: both;
}

http://www.thomasd.info/temp/Firefox.jpg
http://www.thomasd.info/temp/IEundOpera.jpg

Es ist komplett egal, wenn der Text länger ist - Opera und IE richten immer korrekt aus, Firefox zieht den Rahmen über den linken "Frame" und bricht folglich nach Ende der buttons auf der linken Seite nach links ab - weiters ist somit der Content-Bereich zu klein. Was tun

MfG, Thomas D.

 

[Maik]

Hi,

erweiter mal die Regel für #content mit margin-left:210px.

 

[Thomas D]

Ja, so geht's, danke ;-)! Ist das ein bekannter Bug im Firefox? Denn so wie's Opera und der IE lösen, ist's IMO schöner, da man keinen fixen margin-left-Wert eingeben muss und der Content-Bereich-Beginn automatisch an das Ende des LeftFrame-Bereichs gelegt wird ...

 

[Maik]

Ich würde das nicht als Bug im Firefox bezeichnen, denn dann besäßen alle anderen modernen Browser ebenfalls diesen Bug, im übrigen bei mir auch der Opera-Browser (9.25), der sich da ohne die margin-Deklaration genauso wie Firefox verhält.