Jump to content

Would like gradiant background to be static in ie


juliec
 Share

Recommended Posts

I am using a cityscape and need a gradiant background behind it to be a background on all pages. I want the background to be static so that it does not change based on how long the page content is. I am putting it in the body tag in an external css file. It is working okay in all browsers except ie. Does anyone know what I need to do?EXCERPT FROM CSS FILE:------------------------------body { /* for non-css3 browsers */ background:#0099ff; /* for IE */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003366', endColorstr='#0099ff'); /* for the rest */ background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.26, rgb(0,153,255)), color-stop(0.86, rgb(0,51,102))); background-image: -moz-linear-gradient(center bottom, rgb(0,153,255)26%, rgb(0,51,102)86%); background-image: -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#000000', EndColorStr='#099ff')"; /* IE8 */ min-height:100%; font-size:16px; background-position: top center; background-attachment: fixed; repeat:no-repeat; background-size:100%;}#themain { position:relative; width:960px; margin:0 auto; color:#FFF; min-height:250px;}#thetxt { margin-top:20px; margin-bottom:300px; margin-left:175px; height:100%;}HTML PAGE:--------------<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <link rel="stylesheet" type="text/css" href="style.css" /> <title></title></head> <body><div id="themain"><div id="thetxt">BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br />BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. BLAH DE BLAH BLAH BLAH. <br /><br /> <br /><br /></div></div></body></html>

Link to comment
Share on other sites

  • 3 weeks later...

IE always is a little bit behind the times. I'd suggest creating a simple background image with the gradient effect you are looking for and fixing it in place. Allow it to repeat-x to fit the width of the page and add a background colour that will match the end of the gradient for overflow.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...