Footer stuck above left and right div.?


#1

Can anybody tell me why i have this issue with the footer.
It doesnt want to go to the bottom of the page :frowning:
Tried doing as they teach, but im stuck :confused:
Thanks in advance.

Index:

<!DOCTYPE html>
<html>
    <head>
        <link type="text/css" rel="stylesheet" href="stylesheet.css"/>
        <title>My Resume!</title>
    </head>
    <body>
    
        <div id="header"></div>
        <div id="footer"></div>
        <div class="left"></div>
        <div class="right"></div>
    </body>
</html>

Stylesheet:

html{
}

body {
    background: transparent url("http://www.iwallfree.com/wp-content/uploads/2014/03/Black-design-wallpaper-black-background-full-hd-abstract-high-resolution.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
}

.left {
    float: left;
    height: 500px;
    width: 50px;
    opacity: 0.95;
    background-color: #d3d3d3;
    border: 2px solid black;
}

.right {
    float: right;
    height: 500px;
    width: 50px;
    opacity: 0.95;
    background-color: #d3d3d3;
    border: 2px solid black;
}

#header {
    opacity: 0.95;
    background-color: #d3d3d3;
    border: 2px solid black;
    width: 100%;
    height:70px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    position: fixed;
    z-index: 1;
}

#footer {
    opacity: 0.95;
    background-color: #d3d3d3;
    border: 2px solid black;
    width: 100%;
    height:70px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    clear: both;
    }

#2

in which order you put the html element is important, i would put `

below left and right

#3

Haha, of course, i made it in the wrong order in the html page.
Thank's a lot stetim, back to work :smile: