Forskjell på <div> i IE & FF

[kongen]

Her en kode på en html-side som vises forskjellig i InternetExplorer og FireFox.
I InternetExplorer går rammen rundt alle tallene og bokstavene, og i FireFox går
rammen rundt bare tallene.

Hvordan kan jeg fikse slik at rammen går rundt alle bokstavene og tallene i FF?
Jeg bruker denne koden:

<div style="border-color:#0000FF; border-style:groove; position:relative; width:200px">
<div>123</div>
<div>
<div style="float:left">ABC</div>
<div style="float:left">DEF</div>
</div>
</div>

 

[Helge]

<style>

#ramme { 
border-color:#0000FF;
border-style:groove;
position:relative;
width:200px;
}

.left { float:left; }
</style>


<div id="ramme">
<p>123</p>
<p class="left">ABC</p>
<p class="left">DEF</p>
</div>

Den skal vell fungere vil jeg tro (ikke testet)

 

[kongen]

Takk for svar, men samme problem oppstår.

 

[tyr897]

Du må enten spesifisere høyde på boksen, eller "cleare" den med et annet element.

Eksempel:

<style>

#ramme { 
border-color:#0000FF;
border-style:groove;
position:relative;
width:200px;
}

.left { float:left; }
</style>


<div id="ramme">
<p>123</p>
<p class="left">ABC</p>
<p class="left">DEF</p>
<br style="clear: both;" />
</div>

 

[Helge]

og husk å definere style

<style type="text/css" >

 

[kongen]

"cleare" den med et annet element.

Takk
Dette løste problemet.