Positioning Problem -- IE vs. Mozilla

[booms]

Hello,

I'm working on a new design for a new personal site, and am having some positioning problems in IE.

Here is the page itself: http://devnulled.com/index2.html (which validates correctly)

Here is the CSS: http://devnulled.com/css/devnulled-red.css

Notice the gap difference in the first silver "content" box on the left hand side of the screen? IE is pushing it out for some reason... I've been looking all over the net for a solution, and have tried different things, but nothing has worked. Any suggesstions?

Thanks,

- Brandon

[Gamblingharry]

I think this is cos IE does the box model differently to how it should. If you are setting a width to a div, it is best to avoid setting padding too. IE

Heres a good article on it: boxmodelhack.html, that probably explains better!

[Paul O'B]

Hi,

If you are talking about the larger left margin on the main content then this is a known problem with the left margin of the float nearest the left windows edge (or the right margin of a float near the right windows edge).

In these cases IE for some reason gets the margins wrong and almost doubles the margin. Subsequent floats and margins are ok.

The solution I use is to give ie a different margin to compensate although you will need to fiddle with it to get it exact.

* html #contentMain {margin-left:10px}

Only ie will get the above style and even things out.

Hope that helps.

Paul

[carrotflowers]

Because of the asterix, right?

[Paul O'B]

Because of the asterix, right?

The universal selctor bug known as the star selector bug:

More info here:
http://www.info.com.ph/~etan/w3panth...ifiedsbmh.html

Paul

[booms]

Thanks a lot guys.. that did the trick!