IE8 developer tools missing some styles

Question

Hi,

I'm having some problems with some CSS properties in IE8.

I've tested my site in IE7, Chrome and Firefox and they work fine but IE8 is having some layout issues.

I inspect the developer tool option on ie8 and I've noticed that some of the properties I set in CSS are being ignored by ie8. For example:

    #header
{
 position: relative;
 padding: 20px;
 height: 100px;
 background:url(header.png);

}

In this header IE8 ignored the height property: If I inspect the element in developer tools it is missing that property and it's crushed into another line:

background:url;HEIGHT: 100PX

The same thing happens for floats too:

#logon
{
float: left;
text-align:right;
width:20%;
height: 40px;
padding-left: 0px;
padding-right:7px;
border:0;
margin:0;
background: url(navgradient.gif);
}

This ignores the float value:

background: url(navgradient.gif); FLOAT:left;

What is happening here and how can I fix it?

Answer 1

Seems like a parse error, or similar. Try putting quotes around the image names;

background: url('navgradient.gif');

Answer 2

I've seen this happen if the stylesheet contains filter properties.