Re: Absolute slew of problems…

[jinfiesto]

Your markup is very nice. However, you seem to suffer from mild div-itis. Target things directly when you can. Also, in terms of readability; most people consider it good practice to format their CSS in single-line format. You should also specify a doc-type in your HTML, preferably strict.

Now that we’re done doing some basic house-keeping… Your CSS needs serious work. It’s nicely commented, but you’re making lots of conceptual, and syntactical errors.

Like the previous poster, I suggest you use a CSS reset. I use a modified meyer-reset, but his will work just as well, and is admittedly much simpler. Personally, I like removing all browser defaults, but that’s up to you. A css reset is excellent because it decreases the number of "surprises" you’ll get thrown. Also can decrease your difficulty with browsers later on. (This is why I prefer a more extensive reset… It provides a lot of cross-browser consistency.)

Specifying units of measure in your css is the RULE, not the exception. Always specify units (exempting special cases such as shorthand etc…)

Also, it seems you misunderstand ems. They are a typographic measure. Use them for your fonts. Use pixels or percentages for everything else. For the record, 1 em is equal to the measure of the browser default font-size.

At this point, I would strip your HTML down to the bare essentials and restart the css. Keep in mind everything that Doc and I have said here, and you’ll probably nail it this time around. If you have any more problems, we can probably answer them.

Also, as a side note and probably a hint, if you use floats you’ll need to create a .clear class. :P just sayin.