On 29.07.2012 11:41, Georg wrote:
On 29.07.2012 07:29, David Hucklesby wrote:
Now you made me double-check. :)
Always a good thing ... that I don't do as often as I should these
days ;-)
To make my solution work we have to determine the exact width of the
auto-added white-space. As browsers do not add more than 1 space no
matter what - unless we tell them to, we then only have to make sure
elements are not packed together "end to end" in markup.
Double checking indicates that the added white-space is pretty close to
.25em, so this test case...
http://www.gunlaug.com/contents/test/test-floating-boxes-mc0.html
...with relevant CSS being...
.floating {
display: inline-block;
vertical-align: top;
width:140px;
margin:1em 0 0 -.25em;
border:1px dashed #ccc;
position: relative;
left: .25em;
}
...should ideally result in zero space and no overlapping.
To produce the _desired_ spacing in a layout, the right margin on
"floating" can be set to whatever value using whatever unit that goes
with the layout. As long as a layout is not so tight that it causes
"early drop" because of the width of the last right margin on a line, a
nice line-up can be achieved.
IE9, IE8, Safari, Chrome & Opera seem to agree that the amount of
auto-added white-space is around .25em. Have done some font resizing in
IE9 and Chrome, and can't see any problems with that value for the
testcase at hand.
IE7 and IE6 have not gotten their "fixes" in my testcase, so no idea
what those obsolete versions will do.
Firefox 14.01 is "over-precise" as always - causing the occasional
overlap, so the exact amount of auto-added white-space - as Gecko
calculates it - may be slightly less than .25em. More testing...
......[test].....[test].......
My conclusion is that .25em is as close as we can get to cover the
various round-up/round-down points across browser-land. Going lower
breaks it by a px in many browsers, and going higher breaks it slightly
more (often) in Gecko. Gecko seems to get it right with .24em.
regards
Georg
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
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/
