OK I copied your code, and created the two files, index.html & twocol.css -- which I linked correctly. I see two issues; (1) the left column does not come out right color-wise. (2) I notice you want to use 2.gif as a background-image. Your css code causes a generic 2.gif file to appear in the bottom two divs. (3) The background-color "transparent" does not seem to function properly. (This is the first time I have tried using THAT color, lol.)

I want to make designs which are cross-browser compatible, allowing ONLY tiny misalignment issues the common man's eye won't detect. Any other positional or style issues I find, I beat my head on the desk (figuratively) until I find the tweak that makes it so.

I will continue to tweak on your ideas, because I am replacing a frameset website with top/left/main areas due to other FireFox-don't-get-it issues.

Note: I find that css codes I learn at W3Schools work flawlessly in Internet Explorer, and that Mozilla FireFox has a tendency to misinterpret these codes, causing unsightly problems many times. Meanwhile, my Norwegian pal Erik makes designs that look great in FireFox but that IE sometimes garbles. I am seeking the Holy Grail, the KeyCode, the Magic Wand of webdesign, that makes cross-browser issues predictable and therefore invisible (after I wave the Wand, that is). I have yet to learn what the prefixes are for "IE Only" or "Mozilla Only" for example, which allows two similar property/value settings to reside in the same selector.

[ reply ]