[css-flexbox] Discussing the Addition of a '::flex-line' pseudo-element

Good Afternoon,

I believe that flexbox specification is omitting a very useful feature, as it does not include the ability to target 'flex-lines' within a multiline flex container (from a CSS rule).

To accomplish this the flexbox spec could include a new flex-line pseudo-element. I imagine the implementation would be similar to the pattern used by the 'first-line' pseudo-element. But, a flex-line pseudo-element would have to target each flex-line, not just the first.

For Example:

*         .flex-container::flex-line

   Selects each flex-line within a flex container

*         .flex-container::flex-line > .flex-item:first-child

   Selects the first flex-item of each flex-line

*         .flex-container::flex-line > .flex-item:last-child

   Selects the last flex-item of each flex-line

It could also work with other pseudo-selectors for added utility:

*         .flex-container::flex-line:nth-child(even)

   Selects even flex-lines

*         .flex-container::flex-line:not(:first-child)

   Selects every flex-line except the first

Flex-box spec claims that it that 'flex lines are hypothetical containers used for grouping and alignment by the layout algorithm'. It kind of makes sense that a hypothetical container would be a pseudo-element.

This would be very useful in situations where you are applying a border and border-radius to a series flex items that could wrap. There are many design patterns that make use of ":first-child" and ":last-child" to prevent borders from stacking and to set an appropriate border-radius on edge elements. These design patterns even apply to flex based layouts. Since flexbox solves so many CSS layout issues I figure It could also solve something that is nearly impossible to do as of now. Is this a feature worth consideration?

Kenneth Moore
User Experience Designer
Ungerboeck Software International
Kenneth.Moore@Ungerboeck.com<mailto:Kenneth.Moore@Ungerboeck.com>