Re: [css-flexbox] Flex box does not respect inline children/groupings

On Wed, Feb 19, 2014 at 1:48 PM, Andrew Fedoniouk
<news@terrainformatica.com> wrote:
> On Wed, Feb 19, 2014 at 8:59 AM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
>> On Tue, Feb 18, 2014 at 6:29 PM, Andrew Fedoniouk
>> <news@terrainformatica.com> wrote:
>>> According to this document http://www.w3.org/TR/CSS2/sample.html
>>> (non-normative I believe though) <button> and <input> are
>>> *inline-block* elements. And Eric was asking about purely display:inline
>>> elements that do not generate boxes by themselves.
>>
>> They're display:inline in HTML's style sheet.
>
> I see this:
>
> button, textarea,
> input, select   { display: inline-block }
>
> in http://www.w3.org/TR/CSS21/sample.html
>
> Do you use other document? Which one?

Ah, you're right, form elements are inline-block.  Images (and other
replaced elements like <video>) are inline.

>> (And it doesn't matter - inline-block is still an inline-level box,
>> same as display:inline itself.)
>
> I am not sure I understand you here.to be honest.
> inline-block establishes box, inline element is a run of
> glyphs/inline-elements - is not a box by itself.

It all flows together in prose.  You rarely need to or should make a
distinction between the two.  An inline-block box should be basically
equivalent to any other unbreakable inline thing, like a word.


>>> I think that inline elements should stay inline - flexbox shall not
>>> try to change "boxing nature" of its children.
>>
>> We're not changing this behavior, for the reasons I gave in my previous message.
>>
>
> When you apply flexbox on span's container that span gets
> treated as boxed element loosing its display:inline nature.
>
> Check this,
>
> <html>
>   <head>
>     <style>
>       div.flex { display:flex; }
>       div span { border: 1px solid; }
>     </style>
>     <script type="text/tiscript"></script>
>   </head>
> <body>
>   <div>
>     The <span>quick brown fox jumps over the lazy</span> dog
>   </div>
>   <div class="flex">
>     The <span>quick brown fox jumps over the lazy</span> dog
>   </div>
> </body>
> </html>
>
> two divs here should be rendered in the same way.
> That's what Eric was asking about I believe.

I understand what he was asking about.  That's now how the spec works,
and that was an explicit decision made by us in the past.  Flexbox is
not designed to be a prose container.  I gave several reasons earlier
in this thread, and unless you have something to rebut those, I'm not
going to continue this conversation.

~TJ

Received on Wednesday, 19 February 2014 22:20:38 UTC