how to display full bg image on web page

[ramzraja]

Joined: Sep 25, 2010
Posts: 14
posted Today 20:13:50
Hi,

i have added a background image to my content in html but, the image is small so it does not fit to whole browser screen and
image gets repeated. any one help me out , how to cover the entire image on to the browser.

The code is :

body{  
    font-family:"sans-sherif";  
    background: #bbb url(../images/background-tree.gif) no-repeat;  
    height:100%;  
    width:100%;
    margin: 0;  
    padding: 0;  
}

the Image which has the Dimensions of 840*623 and its gif image, when i apply the this image it get repeated at the right edge. so i want the single image to be displayed on the entire screen. i am attaching the image in the attachment. please help me out.

[pxlcreations]

If you want it to stretch, it's going to be pixelated the larger the browser window. However, if you just want it to be the image then white space around it, use this code:

body{  
    font-family:"sans-sherif";  
    background: #bbb url(../images/background-tree.gif);
    background-repeat:no-repeat;
    height:100%;  
    width:100%;
    margin: 0;  
    padding: 0;  
}