ling ling - 6 months ago 19
CSS Question

CSS margin-bottom property not working

I defined this CSS class and apply it to a line of text, and want it to be placed at the very bottom of the page, but it doesn't. It floats in the middle of the page. What's wrong with ?

#bottom {
margin: auto;
margin-bottom:0px;
}


HTML:

<div id="bottom">
<a href="/bword/index.jsf;jsessionid=fc87GyPawnkaIWb_y6ig9Zsmo9aa9wbaizVNFAE7.localhost">Privacy policy</a>
</div>

K K K K
Answer

If you need #bottom to remain at the bottom of the page, then

http://jsfiddle.net/lotusgodkk/GCu2D/1068/

CSS:

#bottom {
    position: absolute;
    top: 100%;
}

html,
body {
    height: 100%;
    width: 100%;
    margin: 0;
}

or if you need at the bottom of the viewport/screen, then: http://jsfiddle.net/lotusgodkk/GCu2D/1069/

CSS

    #bottom {
        position: fixed;
        bottom: 0;
    }

    html,
    body {
        height: 100%;
        width: 100%;
        margin: 0;
    }