html - CSS 页脚不在页面底部

Question

我的页脚有这个 CSS:

/* FOOTER */
#footer {
    width:100%;
    height:580px;
    border-top:4px solid #666666;
    background-color:#eeeeee;
}
#footer-inner {
    width:80%;
    margin:0 auto 0 auto;
    height:inherit;
}
#footerTop {
    width:100%;
    height:480px;
    margin-top:10px;
    border-bottom:2px #000000 solid;
}
#footerTopLeft {
    width:30%;
    height:420px;
    float:left;
    display:inline;
    margin-top:10px;
    padding:0 15px 10px 15px;
    border-right:1px solid #000000;
}
#footerTopMid {
    width:30%;
    height:420px;
    float:left;
    display:inline;
    margin-top:10px;
    padding:0 15px 10px 15px;
    border-right:1px solid #000000;
}
#footerTopRight {
    width:30%;
    height:420px;
    float:left;
    display:inline;
    padding:0 15px 10px 15px;
}

我需要页面底部没有间隙，但由于某种原因有大约半英寸的间隙

这是一个 fiddle :http://jsfiddle.net/mYqS3/1/

Answer 1

在 #footerTop 中将 margin-top 更改为 padding-top

#footerTop {
    width:100%;
    height:480px;
    padding-top:10px;
    border-bottom:2px #000000 solid;
}