Welcome to WebmasterWorld Guest from 54.147.20.131

Forum Moderators: not2easy

Message Too Old, No Replies

divs as web backgrounds

     

CodilX

8:49 pm on Jul 16, 2008 (gmt 0)

5+ Year Member



Hi there,

I'm working on my site and I've hit a bump.

I'm running on a widescreen resolution of 1280x800 and I completely forgot about the other people who have 4:3 monitors and lower resolutions.

My website's content area is about ~900px wide. I've added smoke/fog/light effects outside the 900px div, both left and right, each about ~150px, thus making my website around ~1200px wide.

The issue is, that when viewing the website on a smaller resolution, I get the side scroll bar popping up, and it ruins the entire look and feel of the site.

My question is, how do I make those side divs not interfere to the overall width of the site, and if the viewers resolution is lower than 1200 in width, that those divs would just display as wide as they can?

Thanks!

bcolflesh

8:53 pm on Jul 16, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



[google.com...]

CodilX

9:18 pm on Jul 16, 2008 (gmt 0)

5+ Year Member



thanks, but I can't quite get this to work.. maybe you could help me out?

#container
{
height: 1000px;
width: 876px;
left: 50%;
margin-left: -438px;
position: relative;
}

#left_bg
{
height: 414px;
width: 165px;
position: absolute;
background: url('images/left_bg.jpg');
left: -165px;
top: 0px;
}

#right_bg
{
height: 414px;
width: 165px;
position: absolute;
background: url('images/right_bg.jpg');
left: 876px;
top: 0px;
}

<div id="container">
<div id="left_bg"></div>
<div id="right_bg"></div>
</div>

[edited by: CodilX at 9:34 pm (utc) on July 16, 2008]

 

Featured Threads

Hot Threads This Week

Hot Threads This Month