I am implementing Paul O’Bs IE8+ - Auto height Sticky footer method, with the difference though that I would like to have the header and footer to be fixed and that the middle content will scroll when there is more content then the viewport. I tried everything but the entire principle is breaking when I use position: fixed for header and footer. Should i use a different method to accomplish this?
Hi,
You could only really do that if you have a fixed height for your position:fixed header and footer. The reason is that fixed elements are removed from the flow so you cannot make the middle section avoid them unless you have set specific heights for the fixed elements.
In essence you could just apply your fixed header and footer and then set the content to be absolutely positioned at top xxpx and bottom xxpx where xxpx is the height of your header/footer.