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!
Thanks again,
Liz
... 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.
As far as the doctype goes, if it is not the full version that includes the url reference, for example :
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
then IE can still be in quirks mode where things like auto margin centering will not work. As long as the doctype is complete, these methods will work fine.
For an overfview of some of IE's bugs, including the 3px jog, see this P.I.E. Article.
Thanks for that link! I think i was referred to a page within that in another post (for the peekaboo bug) but i didnt realise it was part of a bigger listing of IEs faults.
As or the doctye I do always have the complete doctype but my sites never center in IE below 6.
eg I have a fixed width on the wrapper and margin:0 auto on this site
(http://www.whizzliz.co.uk/FoodSurveys/index.php)
but it still sits on the left. I have just resigned myself to this fate!
I forget you like to support the older browsers - I consider their user base too small to worry...
IE5 won't recognise the auto margins, but using text-align:center; on the body css, combined with text-align:left; on the wrapper css (to cancell out centred text) will centre in the older browsers.
Reply With Quote
Originally Posted by LizzyB
Bookmarks