Full Page Image Backgrounds in CSS3

I have a couple of domains which I use as placeholders or I use them as an umbrella for other sub-projects. As such, I figured instead of showing a blank white page when visiting the main domain, I could spruce them up a little. The following CSS code can be used to set an image as the entire background of the page.

html { 
  background: url(/img/picture.png) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

Of course it works in most versions of web browsers, except maybe old versions of IE (not surprised...). See my example here.

comments powered by Disqus

Morgan W.

Head over heels for gadgets!