Fix header and footer using css

Fix Header at top and footer in bottom, side bar fix with content part scrolling.

#main{background:#888;position:absolute;top:40px;bottom:60px;width:100%;}
#head{background:#024C68;position:absolute;width:100%;height:40px;overflow:auto;}
#left{background:#0776A0;position:absolute;width:250px;height:100%;overflow-y:auto;}
#right{background:#62B1D0;margin-left:250px;height:100%;overflow-y:auto;color:#000;}
#foot{background:#226078;position:absolute;bottom:0;width:100%;height:60px;overflow:auto;}

Make browser re-size and check.

DEMO