html - css footer not occupy the space and content not showed completely -
i trying make footer css , want footer bottom of page, however, content stretch inside footer, following footer 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 , conditions</a> <a href="https://privacy.html">privacy notice</a></td> </tr> </table> </center> <br> <br> </div>
you can use height of footer element padding-bottom of content , negate same value in margin-top of footer element.
<div class="wrapper"> page content </div> <div class="footer"> footer content </div> .wrapper{ height:100%; padding-bottom:150px; } .footer{ height:150px; margin-top:-150px; }
Comments
Post a Comment