Re: [css3-flexbox] Fixing the "replaced elements may or may not be inline" issue

On Wed, May 16, 2012 at 4:10 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> This issue was discussed at the F2F.  You can skip the next paragraph
> if you don't need a refresher on the issue.
>
> The Flexbox spec declares any child of a flexbox that is a block or
> inline-block (more or less - I won't get into the details) to be a
> flexbox item, while inline elements instead get wrapped into an
> anonymous item.  Unfortunately, replaced elements are display:inline,
> and may not even be replaced at all in some circumstances (Firefox
> renders <img> as a non-replaced inline when the image fails to load).
> However, we'd like layout to be consistent and based only on
> computed-time or earlier values.
>
> The discussion during the F2F ended with a proposal that we hardcode a
> list of replaced elements that should just always become flexbox
> items.  I've now made the relevant change to the spec, and the WG just
> needs to either OK it or discuss changes.
>
> The list of elements that always become flexbox items is: <img>,
> <canvas>, <svg>, <math>, <audio>, <video>, <iframe>, <object>,
> <embed>, <input>, <button>, <select>, or <textarea>.
>
> Any issues with this proposal?

At the telcon today, the WG decided to instead simplify the rule and
just make *all* children of a flex container be flex items.

This kills the problem with replaced elements, but more firmly stamps
down on the mild use-case of putting prose inside of a flexbox.  This
was never an explicitly addressed use-case at all, and is rather
fragile anyway.  The biggest argument was just to allow easy vertical
centering of prose without an additional wrapper, but this broke if
the prose had a block in it (or, given the previous proposal stated in
the email I'm quoting, if it contains an inline replaced element).  In
the future, this will be addressed by align-content as defined for
Block, rather than abusing align-content for Flexbox.

~TJ

Received on Wednesday, 27 June 2012 17:00:39 UTC