Internet Explorer Doesn't Recognise the 'Html' CSS Background Image Tag

Internet Explorer doesn't recognise the 'html' css background image tag?

You should assign the background to the body selector, not the HTML tag:

body 
{
background-image: url("../images/html_bg.png");
 padding-top: 0px;
 margin-top: 0px;
...
}

Assigning it to the HTML selector will not work as the HTML contains the head element as well as the body, and is not generally treated as an object that has a background.

Assigning it to the body selector will ignore the <html> and <head> tags and put it right onto the main body of your page, displaying the background as intended.

(If anyone else can explain this better, go ahead!) :)

Background doesn't show in internet explorer

Try to use

background-image:url('http://localhost/img/logo/purple.png');

IE fails to show html background image (colour is ok)

Seems IE is not allowing the background image tag on the html element. Try doing something like this.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body {
width:100%;
height:100%;
background-color: #ffeacd;
background-image: url(header-ad.png);
background-position: 0px 0px;
background-repeat: repeat-x;
margin: 0px;
padding: 0px;
}
#wrapper {
background-position: center top;
width:100%;
height:100%;
margin: 0px;
padding: 0px;
background-image: url(hdr_GSA_lp.jpg);
background-repeat: no-repeat;
}
.content {
width:1020px;
height: 100%;
padding: 0px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="content">

</div>
</div>
</body>

Why an inline background-image style doesn't work in Chrome 10 and Internet Explorer 8?

As c-smile mentioned: Just need to remove the apostrophes in the url():

<div style="background-image: url(http://i54.tinypic.com/4zuxif.jpg)"></div>

Demo here

CSS - Internet Explorer and the main tag background

IE11 does not support the <main> element natively. You can introduce support for it by either using a script like Modernizr, or a single harmless line of JS:

document.createElement('main');

The element will not be inserted in the DOM, but it will now be recognized as a proper element by IE. After this, it still does not have proper styling. Add the following to your CSS:

main {
    display:block;
}

And all will be fine. The reason you currently see it as not getting any content because IE does not add it to the box model without these 2 steps, and as such it gets no 'layout' or 'size'. It's just invisible, that's why you see the body. It does contain elements, which get rendered (sort of) correctly based on the top left coordinate of the <main> element.

css url() not recognized in internet explorer 10

The content property is only valid on :before and :after pseudo-elements. You should change it to:

.ui-icon-zoom-in { 
  background: url(images/16x16/ZoomIn.png) no-repeat; 
  width:16px;
  height:16px;
}

Apart from that, IE8+ only supports content property if a valid DOCTYPE is specified.

Base 64 CSS background image not showing in IE

There are some methods described here for mimicking the same kind of behaviour in IE.

If you're interested in using Javascript to get IE to conform, there's some useful information here on Dean Edwards site.

css background doesn't show up in ie 6 when using rules like #id.class

IE6 does not support multiple combined selectors to select elements (#id.class or .class.class, etc). IE6 will ONLY recognize the last class/ID in your chain.

Details and example

However, in this case, as long as you only have .homepage and .projectspage on one element on the page, the background image should be showing up on the correct element.

I noticed that you are probably using .homepage and .projectspage to differentiate between two PAGES and the same ELEMENT on those different pages. A good practice is to put the class on the <body> element so you can use it to differentiate each page and their descendants.

<body class="homepage">
    <div id="splash">

Then your CSS would be:

body.homepage div#splash { blah }

body.projectspage div#splash { blah }

Added benefit: you can now target any elements on a per page basis, not just the ones that you add ".homepage" or ".projectspage" to.

Internet Explorer Doesn't Recognise the 'Html' CSS Background Image Tag