Tue, 2013-08-20 13:57
I want my navigation bar to run all the way down the page irrespective of content. I also now have a header bar, which fits to the side of the nav bar, is 100px in height and its width extends to the end of the page.
Now I want the content section below the header and to the right of the nav bar also to extend the full height and the full width of the page.
However because of the additional 100px of the header bar, when I set the height of the content section to 100% it's extending a further 100px below the bottom of the nav bar.
Can someone tell me how to get around this? Thanks.
<html> <style> body, html { margin:0; padding:0; } div#nav { position:absolute; width: 100px; height: 100%; background-color: blue; } div#header { width: 100%; height: 100px; background-color:orange; } div#content { width: 100%; height: auto; background-color: yellow; } </style> <body> <div id="nav"></div> <div id="header"></div> <div id="content"></div> </body> </html>
