Search code examples
cssbackgroundfooter

CSS footer background not showing up

I have the background image of my main page set in the in the body{} of my css file. Is that my first mistake?

body{
    background-image:url('img/bg-white.png');
    width:100%;
    height:100%;
    margin: 0 auto;
}

I want to create a background image for my footer. So I add this to the bottom of the CSS

#footer-background{
    background-image:url('img/footer-background.jpg');
    z-index:1;
}

It's not showing up. Is it being overlapped by the original background? Or is there more to it?

Solution

  • This is just a shot in the dark, need more info for a conclusive answer, but it may be that you haven't specified a height or width for your footer.

    Working Example

    #footer-background{
    background-image:url('img/footer-background.jpg');
    z-index:1;
    height:200px;
    width:100%;
}