css - How to make a DIV take up the remainder of the page? -
i have following html:
<html> <body> <h2>title</h2> <div id='large_div'> blah.. blah.. blah.. </div> </body> </html>
how can make large_div
take rest of page height?
here css page:
html { height: 100%; } body { height: 100%; } #large_div { /* ??? */ }
you try setting negative margin on #large_div equal height of h2. unfortunately not solid code since h2 height change depending on text length , browser:
#large_div { height: 100%; margin-top: -1em; /* adjust height of h2 */ }
a bit of jquery sort out though:
$(document).ready(function(){ $('#large_div').css({height: $(window).height() - $('h2').height()}); });
Comments
Post a Comment