this is kind of difficult to explain. I am looking at building a website in HTML5 and CSS3. I have a section which I want to have the full width of the users computer screen with a height of 80pixels.
I then have a container which holds the body of the website and should be keeping the footer pushed to the bottom of the web page and if there is not enough text to fill the screen then the footer sits at the bottom of the window. However the container doesn't fill the entire screen it is centered to a width of 1024pixels. This works perfectly if I remove the heading section from the web page.
When the heading section is added to the webpage the footer is pushed past the bottom of the window to the same number of pixels that the headers height is set to i.e. the footer is 80pixels lower than it should be.
How can I set the container to be 100% height to ensure the footer is always pushed to the bottom but remove the extra 80 pixels from the heading.
Thanks for any help you can provide
