IE conditional comments fail to load style sheet correctly

[kam270]

I want to use conditional comments to load a style sheet for IE7.

The site im designing for is : www.efficient-heat.net

When I check the site in IE7 I see images for the content area being placed incorrectly. They are over to the right of the page when they should be in the middle.

When I check the images with IE dev bar they have a position of absolute. However the ie_7style.css sheet has them with a position float left. When I link to the ie7style.css without conditional comments and load the page it works as intended.

I believe the absolute positioning is coming from the style.css sheet which is intended for Firefox.

It seems to me that the ie7style sheet isn't being implemented properly and is relying somewhat on the style.css to render the page.

How do I resolve this problem?

[jscheuer1]

I don't really see much difference between FF and IE 7 for that page. If anything, IE 7 looks a little better. The overall markup and styles do appear to be much more complex than is required to achieve the look you have.

Your conditionals look properly constructed. However, you must be doing something wrong if you need so many styles in the IE 7 sheet. IE 7 is just about as compliant as FF, and remember - no style from the main stylesheet which works for IE 7 should appear in the IE 7 sheet. Conditional comments used the way you have them add to the main styles, they do not replace them.

So, if you have set position absolute in the main stylesheet, but want normal (static) positioning in IE 7, you would have to specify that. But if borders, padding, whatnot are the same, these can and should be left out of the IE 7 sheet.