divs opera & IE5.0

[scroots]

I started using divs to position content, one major pitfalls are the the divs in IE are side by side yet in opera they are underneath each other.

How can i avoid/get round this?

scroots

[brothercake]

er .. magic wand? Hard to say without seeing the code ...

But my guess is - are you floating objects left inside a container? In most browsers the container expands to allow the objects to float, but in opera the container tries to be as small as it can. The way round that is to set a width on the container - like 100%, or whatever it needs to be to make room.

[Catman]

Or you're using fixed widths and floating, it could be the different interpretations of the box model.

You can get around this by setting the body and layout div margins and padding to 0px — that pretty much erases the effects of IE's botched box model.

You might also want to consider setting width and float for only one div (or the left and the right divs if you're working with 3-column) and setting the margins of the remaining div accordingly:

<div style="width : 100px; float : left; border : 1px solid #000;">Left Div</div>
<div style="width : 100px; float : right; border : 1px solid #000;">Right Div</div>
<div style="margin : 0px 100px; border : 1px solid #000;">Center Div</div>

Not that you'd actually use inline styles, but it's a little easier to see what's associated with what.

Note that IE (and to some extent Mozilla) will let you get away without setting the margins, but Opera won't. If the contents of the middle div are taller than the left and right, Opera will move the contents below the contents of the left and right divs out to the edge of the browser window even if you set the heights of the left and right divs, and if the contents are scrollable, the scrollbar will be on the right margin of the browser window rather than to the left of the right div.

[ReadMe.txt]

maybe try setting the clear property?

http://www.w3.org/TR/CSS21/visuren.html#propdef-clear