Css background image cover, fight height and width

Question

I have this html code to create a background to my div :

<div id="secondBigDiv">test</div>

This is my css code :

#secondBigDiv{
    background: url(../images/myposts/background.jpg)no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

This code works perfectly as I want but the problem is:

• I couldn't fit the height also, when i scroll down I find empty white spaces because my background image didn't fit the height, it fits the width.

Any help?

Answer 1

I would try putting each image property in its own line. background-repeat,background-attachment, etc

May not change anything but seems to work for me.