CSS website backgroud

Question

Hi Folks, I am looking for some info on CSS style used for many websites these days. Its a style where whole screen is occupied by one background and the websites content is posted on top of it under smaller dimensions. Something like this website: http://www.obiweb.com.au/ How do we achieve something like this? Thanks

Answer 1

This is easily achieved by using the css background property on the body tag:

body {background:#fff url(image.png) repeat 0 0}

You can read up on this css property here: http://www.w3schools.com/css/css_background.asp

You would then have a div container inside your body tag that has a width and margin set to auto:

.container {margin:0 auto;width:900px}

Hope this helps

Answer 2

They apply background image to body tag. Here is for example CSS used by the site you mentioned in your question:

body {
  background:url("/site/default/images/bg_860.png") repeat-y scroll center center transparent;
}

You may read more about background property and its uses here.