On Jul 15, 2010, at 4:48 PM, snak detek+0r wrote: > At the time I couldn't replicate it on my computer, but with the help of > folks here, especially Felix Miata, I understand now that it can be > replicated by changing the monitor resolution. Now that I can examine > it, though, I don't understand what's causing it. And I can't find a way > of fixing it without widening the containing div (which causes other > visual problems). > > Any ideas on how to approach this?
Looking at this through firebug, and after zooming out one notch, the left border on #maincol has a computed width of 1.1333px. That of course, throws everything off. Safari 5 need 3 notches down to have the layout collapse. Here, it is the width that doesn't add up. In both browsers, you are fighting a kind of 'rounding-errors'. One possible way out: don't float your right-hand column (#maincol), and don't declare a width on it (only tested with Firefox and Safari). Simply set 'overflow: hidden' on that element. It will position itself correctly (block formatting context adjacent to a floated block). Oh, and don't declare a width on the 3 div elements inside #maincol. It is not needed, the elements being in the normal flow will take the full width of the parent. Philippe --- Philippe Wittenbergh http://l-c-n.com/ ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
