I'm trying to design a page which will have a header and footer that go across the entire screen (meaning the width will be determined by the size of the browser's window). I have looked through different websites, and couldn't find the correct way to do it (maybe I just don't know the correct name for it). So far I was only able to find a way how to make a fixed header and footer, where once you scroll up or down, they remain on the screen, while the content scrolls under it. What I would like to have is the header and footer scroll up or down when there's a long page. I also want the footer to be stuck to the bottom of the page.
This is the example that I found for fixed version: http://www.noobcube.com/tutorials/html-css/fixed-header-footer-layout-a-beginners-guide-/ Notice how the footer is always stuck at the bottom. I want the header to scroll up when there's a lot of content on the page, and same for footer, but footer should remain stuck to the bottom of the page when it has finished scrolling. I noticed that a lot of Wordpress themes have this too.
Does anyone know where I could find a fairly simple tutorial that outlines the steps or provides the code for this?
This is the example that I found for fixed version: http://www.noobcube.com/tutorials/html-css/fixed-header-footer-layout-a-beginners-guide-/ Notice how the footer is always stuck at the bottom. I want the header to scroll up when there's a lot of content on the page, and same for footer, but footer should remain stuck to the bottom of the page when it has finished scrolling. I noticed that a lot of Wordpress themes have this too.
Does anyone know where I could find a fairly simple tutorial that outlines the steps or provides the code for this?