Position probleem

[Surkow]

Ben vandaag begonnen aan het maken van een nieuwe website. De indeling bestaat uit vier divisions. De header, linker menu, content en footer.

Website link
Stylesheet

Website in IE:



Website in FF:



De content divisie wil ik naast het menu hebben in FF. Ik heb dit probleem eerder gehad en heb dit opgelost door het menu absoluut te positioneren. Weet iemand de oplossing wanneer ik gebruik maak van relatief positioneren?

Het gaat om dit gedeelte van de stylesheet:

Cascading Stylesheet:

/*--------------------begin menu left--------------------*/

#menu_left {
position: relative;
float: left;
clear: left;
width: 210px;
color: black;
background: #ebebeb;
border: 0px solid black;
padding: 0px;
margin: 10px 10px 10px 0px }

#menu_left_contents {
position: relative;
border: 0px;
padding: 4px;
text-align: left; }

.padding {
padding: 4px 8px 4px 8px; }

/*--------------------end menu left--------------------*/

/*--------------------begin content--------------------*/

#content {
position: relative;
float: left;
clear: right;
width: auto;
height: auto;
border: 0px solid black;
margin: 10px 0px 10px 0px;
padding: 0px; }

/*--------------------end content--------------------*/

[equationunequal]

HTML:

<br style="clear: left">

(of een divje met clear: left) onder je content div plaatsen zou het probleem op moeten lossen...

[ Voor 34% gewijzigd door equationunequal op 19-11-2005 18:28 ]

[Surkow]

Hankey schreef op zaterdag 19 november 2005 @ 18:26:

HTML:

<br style="clear: left">

(of een divje met clear: left) onder je content div plaatsen zou het probleem op moeten lossen...

Met m'n footer gaat het niet lukken (zoals je eerder zei). Daar was ik net mee bezig namelijk. Ik ga even verder kloten met clear.

Edit: Het lag aan float: left bij #content in de stylesheet. Float: left verandert in float: none. De website werkt nu naar behoren.

Edit: Niet dus. Nu zit content achter menu.

[ Voor 34% gewijzigd door Surkow op 19-11-2005 19:00 ]

[equationunequal]

Werkt het als je die clears in je gefloate elementen (menu & content) weg haalt

[ Voor 13% gewijzigd door equationunequal op 19-11-2005 22:24 ]

[Surkow]

Hankey schreef op zaterdag 19 november 2005 @ 22:24:
Werkt het als je die clears in je gefloate elementen (menu & content) weg haalt

Als ik dat doe dan blijft content achter menu. Als ik dan float verander krijg ik weer de beginsituatie van FF maar dan ook voor IE. Het lijkt me zo vreemd dat je niet gewoon 2 relatieve objecten naast elkaar kunt laten staan met behulp van floats en clear. Waarom werkt de situatie die ik in de startpost heb beschreven niet voor Firefox? Meestal heb ik nooit een probleem met FF en moet ik mijn website helemaal aanpassen aan IE.

Edit: Misschien ligt het aan de omliggende divisions. Ik ga me daar eens mee bezig houden.