...

View Full Version : problem with resolution in background image



sanduwa
09-03-2010, 06:31 PM
Hi all,
I have created a web page and set a background for it. but when resolution is change, the image is moving round.

please visit here (for convenient i put a table instead of the web page) http://www.sanduwa.comule.com/test/ (the correct position will give when resolution is 1366x768)

i want to keep the background image at constant position(according to the page)
here the code,

index.html (for convenient i put a table instead of the web page )


<html>
<head>
<title>Test</title>

<link rel="stylesheet" href="css/styleback.css" type="text/css" charset="utf-8"/>

</head>
<body>
<div class="palmtrees"></div>
<div class="powerline"></div>
<div class="city"></div>

<div>
<table width="787" height="727" border="2" align="center" bordercolor="#000000" bgcolor="#FF0000">
<tr><td width="777" height="89"></td></tr>
<tr><td height="465">&nbsp;</td></tr>
<tr><td height="161"></td></tr>
</table>
<div>
</body>
</html>

styleback.css,


body{
margin:0px;
padding:0px;
background:#CFB616 url(../images/bg.png) repeat-x 0px -80px;
}

.palmtrees{
position:absolute;
bottom:0px;
right:10px;
width:304px;
height:352px;
background:transparent url(../images/shadow_palmtrees.png) no-repeat 0px 0px;
}

.powerline{
position:absolute;
bottom:-5px;
left:0px;
width:556px;
height:264px;
background:transparent url(../images/shadow_powerlines.png) no-repeat 0px 0px;
}

.city{
position:absolute;
bottom:0px;
left:10px;
width:100%;
height:74px;
background:transparent url(../images/shadow_bg.png) repeat-x -11px 0px;
}

please help me to solve this problem.
thank you very much

.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum