The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS background challenge Re: background challenge

"chriscoyier" wrote:
Hey John,

Interesting challenge. I think this simple solution does the trick:

#leftHalf {
background: url(images/bg-1.jpg);
width: 50%;
position: absolute;
left: 0px;
height: 100%;
#rightHalf {
background: url(images/bg-2.jpg);
width: 50%;
position: absolute;
right: 0px;
height: 100%;

Check out the example:

Cutting your image up didn’t line up quite right, but the theory seems to work.

Hey Chris,

Thanks for the help, it’s almost perfect, on 1px left. I guess that is because when you multiply an odd number of pixels by 50% you always have 1px left. In the middle we have depending of the window size, sometimes a white line.

Look at the idea we try to achive here:

Its has other bugs asswel by the way :) But thats for later….