and in IE6 or below all the right content is dropping below my left nav and I cannot figure why. I have specifically design it so that the outer containers dont have padding or margin to avoid box model problems but im still having no luck now..
What leaps to mind is that without a valid !doctype, IE will not recognize "margin:0 auto;". I don't recall, -did your document have a valid !doctype? I think that it did. It may have, then, it's another issue.
This seems to be that either header or content width exceeded available space. "width:auto" seems to cure this. In a fixed-width container that contains one (or more) additional fixed-width elements, it is handy to have at least one 'fluid width' element to 'shock-absorb' any changes that occur browser-to-brower (like default paddings/margins, font-sizes, etc.). We could be talking in terms of merely a pixel, which is enough overage to cause an element to 'drop' below it's neighbor..
The fixed width content div beside the float invoked IE6's 3px jog bug, meaning then it didn't add up. Removing the width setting allows the browser to determine the width to fit, and eliminates the bug.
Thanks for the advice - that makes a lot of sense to have the one div on auto. I do always have the doctype on but i find that below IE6 my centered designs (using margin:0 auto on a wrapper) never center which made me think that auto was a thing to avoid.
Please tell me though what is this 3px bug? Another new one on me!
... but i find that below IE6 my centered designs (using margin:0 auto on a wrapper) never center which made me think that auto was a thing to avoid...
I believe that only a pixel width or percentage width, and margin:auto; will center a element, "Auto" is not quite the same as "100%" (and in the case of width:100%, there would of course, be no need to 'center' as it cannot get more 'centered' than it already is.)
As for ie jog bug... heard of it, recognize how to correct it, other than that, *I* am not well versed in the matter.