Two Columns with Div - FF different from IE

[theChronic]

hey whats up
Ive been trying to get these two columns to look nice using div tags and I'm having a little trouble because it displays perfectly in firefox but wrong in internet explorer *grumbles* - too bad my niche doesn't all use FF..

<div style="float: left; width:60%">
<h2> some title</h2>
<p>Some information 1
</div>
<br />
<div style="float: left; width:100%">
<h2>Some title</h2>
<p> lots of information
</div>
<div style="margin-left:60%; width:40%;">
<h2> Some title to go on right</h2>
<p> Some info to go on right</p>
</div>

The stuff that is "to go on right" is supposed to go on the right of "Some information 1" so these would be column like with the "lots of information" part under both of them (because it takes up all 100% of the screen - whereas the top two parts can fit side by side).

Any help or pointers would be great - this code was made by looking at a few examples and doing lots of experimenting/copying.

Thanks a lot
John

[chicgeek]

Is the code active on a site? If so, post a linky.

I'm not sure what content you're using, but I don't see why you include your "Some title" etc content in longer divs. But then again, as I alluded to, I can't exactly see what you're trying to do with this...

[Mrblogs]

move the bottom div up above the middle div.

The top divs should be first
the 100% one should be after.

Also keep in mind that IE does not include margin in its 100% calculations, and so it may be better setting them to margin: 0px; or padding: 0px (i can't remember which one it is), and then doing padding inside the divs themselves.

[theChronic]

Also keep in mind that IE does not include margin in its 100% calculations, and so it may be better setting them to margin: 0px; or padding: 0px (i can't remember which one it is), and then doing padding inside the divs themselves.

Ahh i think that's what i forgot. thnx, will check that out.