Background img not showing in IE8 or below, shows in all other browsers I've tested

I've been working at this all morning hopefully som开发者_C百科eone can see the problem, I've missed.

I have a background image set for my header, it works fine in all browsers except IE8 and below, even works fine in IE9 Beta.

Here is the link, http://test.medialayer.net/

Here is the css for the header,

header {
width: 890px;
height: 90px;
background: #fff url('/images/headerBG.png') repeat-x top left;
margin: 0 0 18px 35px;
padding: 0 0 0 10px;
}

I've tried rearranging the order of the css to no avail, it's not the missing space after (), other background images on the page work fine and are set up identically, I've tried using jpg instead of png, made a whole new png, made sure it was rgb not cmyk, and still nothing.

I have no idea what to try next, thanks in advance to anyone who takes a look.

Chuck

If you open the page in IE9, open the developer tools (F12) and change the document mode to IE8, you see that the styling of the header element aren't applied.

The header element is an HTML 5 element, which IE8 and below doesn't understand.

IE 8 chokes on <header>, which is a HTML 5 element.

See this question for workarounds: Does Internet Explorer 8 support HTML 5?

The most popular seems to be the HTML 5 shim.