Question

I’ve been designing a website with WordPress and began doing testing in different browsers, and I discovered, frustratingly, that the main background image of my header is not displaying in IE9, IE8, or IE7 – and most probably, not in IE6 either.

I am relatively new to CSS, and cannot figure out what the problem is. I’ve been searching many help topics and forums, and haven’t found the answer to my particular issue, so if someone would please kindly help me, I would very much appreciate it.

Thanks in advance!

Here’s the link to the site: http://www.godlygirlhood.org/sandbox

Here’s the CSS code for the header:

#branding {
    width: 1015px;
    height: 559px;
    margin: auto;
    background-color: #f2e9b3;
    background-image: url(http://godlygirlhood.org/sandbox/wp-content/uploads/2012/01/GG-header_1015px.png);
    background-repeat: no-repeat;
}

Answer 1

It looks like you are using the HTML5 header tag which is not supported in versions of IE older than 9. You can add support for the tag by using a polyfill script like Modernizr or change the header tag to a div