hiptojive @hotmail.com wrote: > I read that borders in Firefox display on the inside, and in IE on > the outside, so I presume this is part of the problem, but I'm sure > there's something else happening here in my code. > > http://www.thestudioformovement.com/ > > Any insight on how to solve this problem, or how to approach boarders > would be very helpful.
You're right... your document triggers 'quirks mode' in IE6 - the 'xml declaration' on top is the trigger, so IE6 use the same box-model as older IE/win versions. IE6 also uses the old 'quirks mode' centering method, which makes cross-browser alignment of "boxes" even harder. Add in IE's 'auto expansion' bug, and cross-browser alignment becomes nearly impossible. See... <http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_box_model/> ...for more on the subject and variations on how to deal with it. Firefox and other good browsers - including IE7 - use the W3C box-model and centering method, but they do not agree on all details and how to align and round off odd values. You have an element with 'width: 886px' and side-borders inside an element with 'width: 885px', and that doesn't fit in any browser. This is where IE6 (and older IE/win versions) will add its 'auto expansion' bug, and where other browsers may disagree on where to put the "surplus". So, differences are to be expected across browser-land. ----- How to solve it: Franky's solution is the easiest one in your case - moving all borders onto the outer wrapper. Doesn't look like he has "trimmed" all width-values though, so you may want to do that to ensure identical cross-browser appearance. Note that Franky has removed the 'xml declaration' and thereby made IE6 go into 'standard mode'. Mode in itself doesn't really matters here though, because Franky's solution for moving the borders actually _avoids_ the entire box-model problem. This means that all browsers - even old IE5.x/win - will get it right, or at least make it look right. ----- Note that there are potential problems with the removal of the 'xml declaration' in Franky's example. According to the W3C the encoding should be either UTF-8 or UTF-16 if the 'xml declaration' is omitted. You have declared 'encoding="iso-8859-1"'. See... <http://www.w3.org/International/articles/serving-xhtml/Overview.en.php#declaration> The 'charset info' in the meta element solves the problem with validation, but doesn't do much good in browsers - they ignore it for on-line documents. This is one reason why I personally would choose to keep the 'xml declaration' in place, and instead omit the meta element. Of course, I have other reasons too, and I still think 'IE6 works best in quirks mode'... <http://www.gunlaug.no/contents/wd_additions_16.html> Once one has grasped the box models and other mode induced differences, there aren't really any problems left with such an approach. regards Georg -- http://www.gunlaug.no ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
