In FF, with #wrapper set at 984px width, how can 95% wide #ccfbox have room for a 120px left margin?
In IE, how can 100% wide #ccfbox have room for any margin at all?
See the box model here. The box model says that whatever you put inside an element cannot be larger than that element. margin/padding/border all count when figuring width/height.
To demonstrate, use some temporary background colors like this -
In a set width container, why use % at all?
text-align: left; /* Following line center aligns the layout */ margin: 0 auto; width: 984px;
Why even a width at all???
Put a left margin on #ccfbox and no width, it will take all the room remaining.
Look at this example for another approach at building a simple 2 column layout.