If I ever learned a lesson from webdesign…it would be to always use firefox before you use IE. I had a personal website built up very well on my own computer, until I saw it totally butchered in my friend’s firefox browser. So downloading firefox and setting to work at something I knew next to nothing, I was able to pull almost the entire design off identically in both browsers in a few days (although I sadly admit I use free geocities for my site, so IE gets butchered now because the extra ad coding somehow cancels the doctype that allows the page to read correctly otherwise). But here’s the problem.
I have a central section of my webpage that is defined as a single, large div, and inside are three separate divs in a traditional layout. Each side (col-A and col-C) are set to transparent because the background from the large div carries over to the space where they do not extend, and it makes for a good effect. However, even once I have closed the large div and all seems well, Firefox want to put the footer content -that is supposed to be beneath it all- shoved up beneath column c, and things get ugly from there on out. Obviously the whole “height: 100%” bit isn’t going to work since I would need a specified amount around the parent, by why the…why in the world would it not automatically adjust because the content of my to-be many pages relies upon flexibility? Not only that, but only by setting all the elements below to “float: left” gets them to even appear underneath, and even then I can’t get a margin at the bottom of the page, and it’s all very messy (and shaved-looking).
The code is quite messy as yet, in the sense that I’ve whittled out all the junk and simplified it, but it still loses its sense. The question is – how do I set the height of the large div (or smaller ones? you guys know better than I do) so that the div will encompose all the material inside and allow my footer material to display with ease beneath and outside the div tag where it belongs?