CODEWITHSUNDEEP
htmlcssinternet-explorer
Soarabh
Soarabh

Reputation: 2960

Background image is not in centered in IE6

I am trying to use a body background image which is center aligned, but it does not work in IE 6. The CSS for the body is

body{line-height: 160%;font-family: "Trebuchet MS", sans-serif; font-size: 80%; 

/*     background: #000a28 url('img/main_bg.png') no-repeat center top;*/
background-image:url('img/main_bg.png');
background-repeat:no-repeat;
background-attachment:scroll;
background-position:center top;
background-color: #000a28;
width: 100%;
margin: 0 auto;
color: #ffffff;
text-align: center!important}

For IE 6 I wrote the following CSS

body {
  text-align:center;
}

#main-wrapper {
  margin:0 auto;
  width:960px;
  text-align:left;
}

Please help me.

Upvotes: 0

Views: 478

Answers (2)

Yi Jiang
Yi Jiang

Reputation: 50125

The reason why it's not working is because of the SuperSleight transparent png script you are using. Because the script runs only after everything's loaded, the background first centers, then jumps back to the left when the script runs. As far as I'm aware, AlphaImageLoader does not allow for background position to be changed.

Try using this script instead: http://www.dillerdesign.com/experiment/DD_belatedPNG/. It uses a different solution which should allow for background-position to be used.

Upvotes: 2

eugeneK
eugeneK

Reputation: 11126

Try my code instead of your body's properties

body{
background:url('img/main_bg.png') #000a28 no-repeat center top;
color: #ffffff;
font-family: "Trebuchet MS", sans-serif; 
font-size: 80%;
line-height: 160%;
text-align: center;
}

Upvotes: 0

Related Questions