Stretch Background Using CSS Background

For More Videos Visit Our YouTube Channel

What is this issue ?

Here we consider how to Stretch Background Using CSS Background. If you are using CSS 3, this can be done by using background-size.

#DivID
{
        background-image: url('ImageURL.png');
        background-size: 100%;
}



If you are using normal CSS, we can follow below shown method.
Suppose, we have a Div with an image inside.





Now, to strech this image wrt the Div, we can do as follows.
Provide following style for the Div and the Image.


#BackgroundDiv {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        z-index: 0;
}
.stretchDiv
{
        width:auto;
        height:auto;
        min-width:100%;
        min-height:100%;
}




By applying the above style for Div and Image, we can stretch the background.