div tags

redman · 22 nov 2010, 18:08

Is het mogelijk om 2 div tags langs mekaar te zetten en deze in een andere div tag te plaatsen.
De eerste div tag moet naar links "floaten" en de andere naar rechts.
Bij alle browsers heb ik dit klaar gekregen maar het wil niet werken in internet explorer.
Ik gebruik "float" om de div tag naar links of naar rechts te plaatsen.

matx5 · 22 nov 2010, 18:27

Ik was zelf een beetje met html aan het spelen en heb het even getest.
Volgende code werkte hier in Firefox en IE8:

Code: Selecteer alles

<div>
<div style="float:left">
<p>links</p>
</div>
<div style="float:right">
<p>rechts</p>
</div>
</div>

brechtb · 22 nov 2010, 18:32

matx5 schreef:Ik was zelf een beetje met html aan het spelen en heb het even getest.
Volgende code werkte hier in Firefox en IE8:
Code: Selecteer alles
<div>
<div style="float:left">
<p>links</p>
</div>
<div style="float:right">
<p>rechts</p>
</div>
</div>

Jep, zelf ook even getest, dit lukt toch gewoon in IE?

Of heb je ze alletwee een width van 50% gegeven, daar kan het wel eens mis lopen met IE

Code: Selecteer alles

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
    <style type="text/css" >
    #left
    {
    	float:left;
    	
    }
    
    #right
    {
    	float: right;
    }
    
    
    </style>
</head>
<body>
<div id="container">
<div id="left">links</div>
<div id="right">rechts</div>

</div>
</body>
</html>

22 nov 2010, 20:03

Opletten met het box model: margins, padding, borders moet je bijtellen bij de width. Als je dan width 50% doet en dan nog een van die voorgaande hebt ingesteld gaat de 2e div breken naar 'de volgende regel'.