CSS overriding for IE... need help.

[WyattSoft]

I'm making a new website.

I have my navigation bar division set with a "inline-block" display property, which doesn't seem to work correctly with IE7 and below.

I can fix this by setting the display property to "inline" but standards compliant browsers hide the background image, which is not what I want.

So I need to have some sort of override for the display property for IE7 and older.

So I tried this code:

HTML Header

Code: [Select]

<link href="css/home.css" rel="stylesheet" type="text/css" />
 <!--[if lte IE 7]>
   <link rel="stylesheet" type="text/css" href="href="css/home_ie7.css" />
 <![endif]-->

CSS: home_ie7.css

Code: [Select]

@charset "utf-8";
/* CSS Document */

#nav {display:inline;}

And it doesn't work.

I've also tried adding !important to the CSS but it still doesn't work.


All help is appreciated.

WyattSoft

[WyattSoft]

Anything?

[kpac]

I'm not sure about this, but I presume "lte IE 7" means less than IE7?

[WyattSoft]

Less than or equal

I got it from here:
http://www.quirksmode.org/css/condcom.html

[kpac]

Here are some more refs for you:
http://msdn.microsoft.com/en-us/library/ms537512(VS.85).aspx
http://reference.sitepoint.com/css/conditionalcomments
http://www.webmasterworld.com/css/3673285.htm