[nightscream]

Hi

I've stumbled into a weird css problem.
I've got 2 hacks one for IE6 and below and one for IE7.
Now it seems the hack is also read by firefox, in other websites I don't have this problem only in this new website.

The first one is for ff, second one for IE6 and third one for IE7.
If I use this css the margin in firefox is 0 0 0 0 so any ideas why this happens only on this website?

Thanks!

#info-product li {
	padding-top: 3px;
	margin: -15px 0 0 0;
	display: block;
}
*html #info-product li {
	margin: 0 0 0 0;
	
}
html>body #info-product li {
	margin: 0 0 0 0;
}

[gregwhitworth]

html>body #info-product li {
	margin: 0 0 0 0;
}

That's not a hack. That's using the parent selector set in CSS2:
http://www.w3.org/TR...child-selectors

Also - you shouldn't be using hacks in the first place. Mainly because when said browsers become aware of the hacks they usually fix them. You should utilize conditional comments set in place by IE (because they know how screwed up their browser is). This allows you to single out a browser - but it also maintains that it will work in the future as this is a feature - not a hack.

http://msdn.microsof...512(VS.85).aspx

Hope that helps,
Greg

[nightscream]

mmh does this also work in css? or only in html?

[gregwhitworth]

You create conditional comments to link to different CSS docs - like so:

<!--[if (gte IE 5.5)&(lt IE 7)]><link type="text/css" rel="stylesheet" href="ie6.css" media="screen" /><![endif]-->

[nightscream]

So is it possible to make a css for the whole page and than another css file with only the changes that need to be done(the fixes). So ie will overwrites the style or doesn't it work like that? because my fixes are most of the time just a few.

[gregwhitworth]

Yes. That's what you are supposed to do. Setup your layout to look good in FF or Opera and then follow the Cascade in the CSS, place your IE stylesheets at the bottom of the cascade.

<link type="text/css" rel="stylesheet" href="layout.css" media="screen" />
<!--[if (gte IE 5.5)&(lt IE 7)]><link type="text/css" rel="stylesheet" href="ie6.css" media="screen" /><![endif]-->

Hope that helps.

--

Greg

[nightscream]

Thanks!

Now I don't have to use those hacks I've got problems with.