jquery - Header, main, footer stretch to fill page -
i have following kind of html:
<header></header> <div id='main'></div> <footer></footer>
where preferably positioned relatively. header , footer have known height. i'd main div to, default, fill entire page, header @ top of page , footer @ bottom of page.
help?
using jquery:
$(function() { var height = $(window).height() - ($("header").outerheight() + $("footer").outerheight()); $("#main").css("min-height",height+"px"); });
what did set main div height browser viewport height , subtracted height of header , footer.
i hope helps :)
Comments
Post a Comment