- From: Peter Salas <psalas@microsoft.com>
- Date: Fri, 15 Feb 2013 00:39:03 +0000
- To: "www-style@w3.org" <www-style@w3.org>
There doesn't seem to be any consistency across browsers about the baseline of flex containers with no items, and of flex containers with items with no baseline. Here are four cases: http://jsfiddle.net/nfzbj/ Case 1 has an inline-block with no content. IE, Chrome, and Firefox all agree that the baseline of the inline-block is the bottom of the inline-block's margin box. Case 2 has an inline-flex with no content. IE uses the bottom of the margin box as the baseline, Chrome uses the bottom of the content box, Firefox uses the top of the content box. Case 3 has an inline-block containing only an inline-block with no content. IE, Chrome, and Firefox all agree that the baseline of the outer inline-block is the bottom of the inner inline-block's margin box. Case 4 has an inline-flex containing a single flex item with no content. IE and Chrome use the bottom of the flex item's content box as the baseline; it's not clear to me what Firefox is using as the baseline. The part of the flex spec that ostensibly covers this is section 8.5., main-axis baseline, #3: "Otherwise, the flex container's main-axis baseline is synthesized from the first item's content box, or, failing that, from the flex container's content box."[1] So flex mentions "content boxes", but the linked writing modes spec says this about synthesizing baselines for elements with no baselines, "If an atomic inline (such as an inline-block, inline-table, or replaced inline element) is not capable of providing its own baseline information, then the UA synthesizes a baseline table thus: alphabetic - The alphabetic baseline is assumed to be at the under margin edge."[2] Should the margin box or content box be used in these cases? Inline-blocks use the margin box; I don't see any reason to do anything differently for inline-flex (that is, I think case 1 should be identical to 2, and 3 identical to 4). I can't tell if the current flex spec is saying to use the content box or if it's saying to refer to the writing modes spec which says to use the margin edge. Thanks, Peter [1] http://dev.w3.org/csswg/css3-flexbox/#flex-baselines [2] http://www.w3.org/TR/css3-writing-modes/#replaced-baselines
Received on Friday, 15 February 2013 00:40:12 UTC