Complex backgrounds with 100% width and Absolute Positioning

Lately one of our designers has been sending down a lot of psd layouts with complicated background elements, involving the need to tile-x a repeating background, but still have a "static" type background at least 1500px wide, without creating horizontal scroll bars for smaller viewports.

After doing some digging around, the best way I've come up with for dealing with this particular issue is to set the x-repeated background as the body background, then absolutely position a layer behind the rest of the page, set to width: 100% and background: no-repeat.

Annoying? Yes.

0 comments:

Post a Comment