Re: [css-regions] Concern about CSS regions flowing into generated content

On Thu, Jul 26, 2012 at 7:47 PM, Alan Stearns <stearns@adobe.com> wrote:

> On 7/26/12 6:49 PM, "Elliott Sprehn" <esprehn@gmail.com> wrote:
> ...
>


>
> Elliot,
>
> There are two ways that generated content interacts with named flows and
> regions. First, an element can be redirected to a named flow. The
> generated content associated with that element will be rendered in the
> region chain along with the element. Second, a CSS Region itself may have
> generated content, and section 5 describes how that content interacts with
> the named flow content in the Region Box. In both of those cases,
> generated content is limited to the current set of possibilities, so I do
> not think that is what you're asking about.
>

Yeah, I understand these cases and they seem fine.


>
> The flow-from property applies to non-replaced block containers. A
> ::before pseudo-element with display:block could have flow-from apply. In
> this case, generated content for the pseudo-element is not visually
> formatted, and we merely use the CSS-generated box from the pseudo-element
> as part of the region chain. That's the use case - defining a box in CSS
> rather than a box from an HTML element to use as a CSS Region.
>

This is the part that concerns me, since this box is now part of the region
chain you could end up rendering a link or an input inside a generated
content box which wasn't allowed before.


>
> So the fragment of the named flow that flows through the pseudo-element
> box isn't "inside" the generated content. It's only "inside" the
> CSS-generated box, and the pseudo-element's generated content is not
> displayed. Does this address your concern?
>

Can you give an example of a real world use case for this feature? I
understand what it does, but I don't understand why you'd ever actually
want to do this.

For example the below was never possible before, and it seems really
bizarre that the way you can now put random content like form controls into
pseudo elements is Regions. If we want pseudo elements to be able to
contain anything we should spec the content property as allowing a ref(#id)
or something, but Regions doesn't seem like the right way to introduce such
a feature to the platform.

Webkit's implementation of pseudo elements is also very fragile and buggy,
so this feature doesn't work how you'd expect in many cases.

Could we break this part of the Regions spec out for a different time? It
doesn't seem critical for real world usage of Regions, it has a high
implementation cost, and it introduces some weirdness in the platform.

<style>
    #content {
      -webkit-flow-into: example;
    }
    #region::before {
        -webkit-flow-from: example;
        content: "";
        display: inline-block;
        vertical-align: top;
        width: 5em;
    }
</style>

<div id="content">
    <button>Example</button>
</div>
<div id="region">
    Content.
</div>