Give both your header and footer fixed position and set top and bottom margins for the main div as heights of header and footer respectively.
/*Main Styles*/
html, body
{
margin:0px;
padding:0px;
width:100%;
height:100%;
overflow:hidden;
}
/*Header Styles*/
#master_header_div
{
background-color:Purple;
height:72px;
display:block;
width:100%;
top:0px;
}
#master_main_div
{
overflow:hidden;
background-color:Red;
width:100%;
margin-top:72px;
margin-bottom:20px;
display:block;
height:100%;
}
/*Footer Styles*/
#master_footer_div
{
background-color:Purple;
height:20px;
position:fixed;
bottom: 0;
display:block;
width:100%;
}
Here is fiddle: fiddle