Stretching div background image for IE7

Question

I'm stuck at making IE7 stretch background image for div, it does not support CSS3 background-size .
Basically I need image fitting red area .

Div may have different height depending on content. That is why I had no luck with img faking background , I don't know how to set height.

Can anybody please help me?

Answer 1

A quick google search came up with (I haven't tested it, but Google is a lovely good friend):

<style type="text/css">
  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
  img#bg{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
  }
  #content {
    position:relative;
    z-index:1;
  }
</style>

Edit: Derp. Forgot the sample HTML

</head>

  <body>

     <img src="size-bg.jpg" alt="background image" id="bg" />
     <div id="content">Your website content.</div>

  </body>
</html>

Linked from: http://dipaksblogonline.blogspot.com/2011/01/ie-78-stretching-background-image-to.html

Stretching div background image for IE7

Question

1 answers

solution1
0 ACCPTED 2011-12-09 18:17:16

Stretching div background image for IE7

Question

1 answers

solution1 0 ACCPTED 2011-12-09 18:17:16

solution1
0 ACCPTED 2011-12-09 18:17:16