Perfectly Working Full Width Background Image CSS

28 Sep , 2012  HTML & CSS 

This tutorial explains the CSS code which can make the background image of a website full width and stay stable on different resolutions.

Full-Size-Background-Image

Check out the demo before going through the HTML and CSS:

DEMO


HTML:

The complete CSS which does the magic:

The CSS code above is self explanatory. I’ve inserted comments in the CSS to help the code more¬†understandable and easy to debug.

In the demo page, use the browser’s CTRL and PLUS(+)/MINUS(-) key to change the browser resolution to see the fixed effect of the background.

If you have any doubts and questions, please let us know by commenting below.

Enjoy!



,

Comments are closed.