I am working on the site http://cardinalmma.com/. In the bottom you can see a cage like background image. My client want it to set the background image to the browser window size. Inspite of doing some css tweaks i cannot set the background image to 100% of the browser size. Can anyone help me.
Remove your background from #background and add it to body like so..
body{
background: url(images/19-background.jpg);
}
You have to use background-size property.
background-size: cover;
body{ background: url("ur image") no-repeat cover ;}
use this
I'm using a nice jQuery plugin which is able to scale pictures to fullscreen size. Depending in what you want to achieve this could be a solution for you, too.