Surpass Web Hosting Forums - View Single Post

**twirp** · September 22nd, 2006, 4:00 PM

I'm trying to make a layout (that's fluid I think...?)
But whenever it starts to scroll, the background doesn't match the image.
Click & See
The css is:

Code:

body{
	background: #2B452C url(http://tyl.cc/images/random_bg_l.jpg) repeat-y left;
	overflow: hidden;
}

#container{
	background: url(http://tyl.cc/images/random_bg_r.jpg) repeat-y right;
	overflow: auto;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
}

#topbar{
	background: url(http://tyl.cc/images/random_02.jpg) repeat-x;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	height: 500px;
}

#topleft{
	left: 0px;
	top: 0px;
	background: url(http://tyl.cc/images/random_01.jpg) repeat-x;
	width: 401px;
	height: 500px;
	position: absolute;
}

#topright{
	right: 0px;
	top: 0px;
	background: url(http://tyl.cc/images/random_03.jpg) repeat-x;
	width: 345px;
	height: 500px;
	position: absolute;
}

#menu{
	position: absolute;
	top: 279px;
	right: 20px;
	width: 180px;
}

and inside the body:

Code:

<div id="container">
<div id="topbar"></div>
<div id="topleft"></div><div id="topright"></div>

<div id="menu">
<!-- Menu -->
Menuness
<!-- Menu -->
</div>

</div>

Thanks for any help. (and I hope this belongs here)