float problem in IE and faux column in Firefox

[nfs]

I'm doing the frame work of a web site and I encountered two problems.
The web site is at http://geyabin.com/temp/index.htm

First, there seems to be some problem with float in IE that the two columns
on the right cannot be positioned at the same level as the first column.
Second, the faux columns are not showing up in Firefox and I cannot figure
out why, could someone please help me out? Thank you very much!

[ronaldb66]

Since I see three perfect columns in Mozilla, your first issue probably is caused by some IE-specific width problem, likely the double margin float bug; try to fiddle with margins and widths, and add some borders to see where everything ends up.

The second issue most likely is caused by compliant browsers such as FF to collapse the "page-body" div to zero height since it seems to contain nothing but floated elements (IE doesn't do this, though it should). Try and add a temporary footer element after all the floats and give it "clear:both"; it needn't contain anything, although being able to actually see it may be practical in this stage. You'll probably end up seeing the footer sit nicely underneath the tallest column, and the background stretch from header to footer.

[nfs]

Thank you ronaldb66! I got them all worked. :thumbsup: