I’m trying to do the following. Create a website with a static top (Header) and article area in the middle and a sticky footer with the navigation controls. My challenge is the following. I want the controls to at the bottom of the page at all time, so in case one rescale the browser / open the page at different resoullution it is only the article area that is resized …. I have not been able to solve this / or seen a page that is doing this.
I want a static header of 100px, a static footer of 150px and an article area of window.innerHeight – footer – header
I have seen a lot of page with static footers, but all for all of them you have to browse to the bottom of the screen for it so be seen. I want mine to shown in the bottom of the screen at all times.
Any help will be much appreciated.