css页脚不占用空间，内容不完全显示

Question

我试图通过CSS制作页脚并希望页脚成为页面的底部，但是，有些内容会延伸到页脚内部， 以下是我的页脚css

#footer {
position: fixed;
bottom: 0;
width: 100%;
}

<div id="footer" style="background-color:#0099CC">
    <center>
    <table style="width:100%">
    <tr>
    <td valign="top">Copyright © 2016, Chaatz</td>
    <td align="right" style="white-space:pre"><a href="https://legal.html">Terms and Conditions</a>
                                              <a href="https://privacy.html">Privacy Notice</a></td>
    </tr>
    </table>
    </center>
    <br>
    <br>
</div>

Answer 1

您可以使用页脚元素的高度作为内容的填充底部，并在页脚元素的margin-top中取消相同的值。

<div class="wrapper">
    page content
</div>

<div class="footer">
    footer content
</div>

.wrapper{
    height:100%;
    padding-bottom:150px;
}

.footer{
    height:150px;
    margin-top:-150px;
}