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

Popular posts from this blog

c# - SVN Error : "svnadmin: E205000: Too many arguments" -

c# - Copy ObservableCollection to another ObservableCollection -

All overlapping substrings matching a java regex -