Hallo mensen,

Ik probeer een content te maken met 3 kolommen.. Nu lukt dit nog niet helemaal. Dit is wat ik heb: linkje.

CSS:
#kolomlinks {
	background:#9933CC;
	width:200px;
	height:100%;
	float:left;
	margin-left:15px;
	}

#kolommidden {
	background:#000066;
	width:520px;
	float:left;
	margin-left:15px;
	margin-right:15px;
	}

#kolomrechts {
	float:right;
	background:#006633;
	width:200px;
	height:100%;
	margin-right:15px;
	}
.

IN IE doet hij het goed, in FF niet.

height 100% weghalen bij je kolommen,

je moet je floats clearen:


<div style="clear:both;"></div>

        </div>        
        <div id='contentfooter'>
        </div>
        <div id='footer'>
        Copyright Design XTR IT Solutions - Alle rechten voorbehouden&nbsp;&nbsp;&nbsp;

        </div>
    </div>


Stel dat je opbouw zo is:

<div>
<div id="kolomlinks"></div>
<div id="kolommidden"></div>
<div id="kolomrechts"></div>

/*
plaats hier een <div style="clear: both;"></div>
dit zorgt ervoor dat je divjes die een float hebben binnen je buitenste div zullen vallen.... zo te zien is dat het probleem.
*/

</div>
<div id='contentbody'>
<div id='kolomlinks'>

</div>
<div id='kolommidden'>

</div>
<div id='kolomrechts'>

</div>
<div style='clear:both;'></div>
..

Dit is wat ik nu heb, in IE doet hij het, maar in FF laat hij niets zien :S
Zet ook een daadwerkelijk tekst in je divjes, zo te zien heb je dat niet... heel misschien zie je ze dan opeens wel ;)
Grapje :D

En hoe kan ik er nu voor zorgen dat de divs even lang zijn als de contentbody div (die minimaal 300px is).
door in alle 3 de div's ook een div met clear:both te geven ;)
Dit werkt niet helaas :(
De hoogte is lastig op te lossen. Zoek eens naar faux columns

Reageren