So let me begin with that I am sort of new to html and css world. I have built a few sites in the past and that’s about it.
The project that I am working on now is to refresh my online portfolio site.
Here is the mockup of the site I am making [img]http://idisk.mac.com/marc.dostie//Public/mockup.png[/img]
With this design I have some tricky things I want to happen:
1. 100% x 100% stretched background
2. A sticky footer that rests below the content and will be pushed down to the bottom
3. Two left justified vertically centered fixed height divs.
Now I have been able to create all of the above mentioned concepts by themselves. But when I try to combine these ideas, things fail miserably.
does anyone know of a site that has these elements together, to which I could take a look at or some good tutorials that have these ideas combined and not separate?
To start: You have this code for both the img#background and div#wrap
My Screen size is 1440×900, but my browser window is only 740px tall. Since your min height is taller than my screen, My screen can scroll, and the footer is "below the fold." Why do you have a min-height?
Let me know what other problems you’re having. (Let me see this horrible white space when you add content.)
Sorry for the delay. Here is an updated version I have been working on, If I lower the min-height of the two items that is when the browser produced this white space. In this demo I changed it to min 600 and If your browser is maximized; try to resize it to be smaller. Once the scroll bars appear, a white space at the bottom of the page shows up. I cannot seem to find a way to rid the code of this.