CSS Sticky Header/Footer and Fully Stretched Middle Area?

Question

With CSS, how can i simply get a page with sticky header and footer which are appearing forever, whenever the page is scrolling or not. I found som

Answer 1

Can use absolute position for all 3 elements.

#header,#footer,#content { position:absolute; right:0;left:0}

#header{
   height:100px; top:0;
}
#footer{
  height:100px; bottom:0;
}
#content{
  top:100px;
  bottom:100px;
  overflow:hidden; /* use this if don't want any window scrollbars and use an inner element for scrolling*/
}

DEMO: http://jsfiddle.net/RkX8B/