See diagram linked below:
http://i4.photobucket.com/albums/y104...- The HTML body tag has a background image which needs to be visible through a transparent header/footer.
- Header must be 100px high and fixed to the top of the browser window, contains graphic.
- Footer must be 100px high and fixed to the bottom of the window, contains graphic
(Unless there is enough content to fill the content section in which case it would push the footer down, full screen scrolls)
This looks simple, similar to faux columns: 3 divs in a wrapper div set to 100% height along with body/html 100% height, and a y-repeat image on the wrapper background to give the effect of the middle stratching to fill the space between header and footer divs.
But putting the y-repeat image on the wrapper div covers the whole verticle area, and I need a transparent header and footer to show the page background image which is on the HTML body element.
Using standards based CSS is there is no way to set the middle div height="100%". That works or is valid.
Using old school tables you have to force quirks-mode with the old doctype for IE to get 100% height table, and I'm worried quirks-smode could bring more layout problems. Can't use %height as I have fixed graphics in header and footer.
And I can't change the design unfortunatly. Anyone able to help?