Header background picture not displayed on ie6, ie7 and ie8

Question

Would you know why the background picture of my header is not displayed on ie6,7 and 8 despite the fallback and how to fix this? See http://goo.gl/YbW2xb

Many thanks

.wrapper-3 header {
background-image: url('../images/.jpg'); /* fallback */
  background-image: -webkit-linear-gradient(91deg, rgba(255, 255, 255, 0.23) 0%, rgba(0, 0, 0, 0) 100%), url('../images/.jpg');
  background-image:    -moz-linear-gradient(91deg, rgba(255, 255, 255, 0.23) 0%, rgba(0, 0, 0, 0) 100%), url('../images/.jpg');
  background-image:      -o-linear-gradient(91deg, rgba(255, 255, 255, 0.23) 0%, rgba(0, 0, 0, 0) 100%), url('../images/.jpg');
  background-image:     -ms-linear-gradient(91deg, rgba(255, 255, 255, 0.23) 0%, rgba(0, 0, 0, 0) 100%), url('../images/.jpg');
  background-image:         linear-gradient(359deg, rgba(255, 255, 255, 0.23) 0%, rgba(0, 0, 0, 0) 100%), url('../images/.jpg');
  background-position: 0% 0%, center center;
  opacity: 0.95;
}

How it looks like on ie:

How it should look like:

Answer 1

The problem is that IE<9 do not have fully support of the new HTML5 semantic tags, so the Css can not see the rules you pass to them, as you try to do on the "header" tag (see screenshot of IE8 inspector). See here for complete reference: Html5 Semantic Elements Support . Use the "HTML5Shiv" polyfill to enable the compatibility: have a look here Html5Shiv , and then debug with the Developer Inspector Bar (Press F12). For custom Css, use IE conditional stylesheets .

Answer 2

background: url('../images/.jpg'); /* hope you set a filename on this :D */

anyway, you probably need to use html5 shim

https://code.google.com/p/html5shiv/

enables html5 support in older browsers

Answer 3

尝试：

background: url('../images/.jpg'); /* fallback */