2 replies [Last post]
monkeytennis
Offline
newbie
Last seen: 8 years 51 weeks ago
Timezone: GMT+1
Joined: 2010-10-19
Posts: 2
Points: 3

Hi, i'm quite new to CSS but feel fairly comfortable with most subjects, however one thing is driving me crazy as i simply can't figure out how to do it elegantly.

I would like to be able to have certain background colours/images repeat outside of their container and across the width of the browser.

I can do this with a background color/image in the main body css, but that only applies to one image/colour.

A good example is: http://www.justalab.com/index.html

Both their 'contact' and 'work' sections have a black background extending across the width of the browser and which 'seem' to have their height contained, just not their width. I could post other examples but its a popular effect so i'm sure you know what i mean.

I have tried searching but to be honest, i'm not exactly sure of what to search for.

This is my first post and i apologise if it's an obvious solution, but i just can't see it!

Thanks

Vade
Vade's picture
Offline
Enthusiast
Ireland
Last seen: 8 years 46 weeks ago
Ireland
Joined: 2007-08-13
Posts: 315
Points: 276

You should get yourself

You should get yourself firebug for Firefox or the web developer toolbar for IE and you'll be able to inspect elements on a webpage.

In the example you provided they have divs set to 100% width so they automatically take up the full resolution width and contained within these divs they have a container div set to 960px and centered

monkeytennis
Offline
newbie
Last seen: 8 years 51 weeks ago
Timezone: GMT+1
Joined: 2010-10-19
Posts: 2
Points: 3

Ah, so simple! Vade, thank

Ah, so simple!

Vade, thank you so much.