Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css-align][css-flexbox] Should align-self and flex (& its subproperties) be honored on table wrapper box? #547

Closed
dholbert opened this issue Sep 28, 2016 · 7 comments

Comments

@dholbert
Copy link
Member

dholbert commented Sep 28, 2016

Load https://jsfiddle.net/vhomvqor/3/ in Firefox, Edge, or Chrome. This testcase has a flex container, with a display:table child inside of it. That child has flex:1 and align-self:flex-end.

For some reason, Chrome / Edge / Firefox all interoperably honor align-self but do not honor flex:1 on the child.

I'm curious if we're all somehow correct (I think we're probably not), or whether we need to make this consistent & get it specced.

Technically, I think ignoring these properties is the most spec-compliant thing to do, since the flex item here is really the table wrapper box, and the table wrapper box isn't author-stylable & only honors a strict whitelist of properties that it takes from its table box (and all other properties should be at their initial values), as described in CSS2 section 17.4: https://www.w3.org/TR/CSS2/tables.html#model

But subjectively, I think the spirit/intent of that table spec-text is something like: "if a property is meant to be used by an element's container, it should be used on the table wrapper box." (Maybe I'm interpreting it too broadly, but that seems like a reasonable behavior.) If this interpretation is correct, then both align-self and flex would fit the bill...

Perhaps the flexbox spec (and css-align spec) should include some normative text that broadens the list of a table's properties that are used on the table-wrapper-box?

@dholbert
Copy link
Member Author

dholbert commented Sep 28, 2016

Perhaps the flexbox spec (and css-align spec) should include
some normative text that broadens the list of a table's properties
that are used on the table-wrapper-box?

We probably need this for the grid spec, too, for all of its properties that apply to grid items (e.g. grid-row, grid-column).

Also, I should clarify one thing -- when I say table wrapper box, I'm specifically talking about the special parent-box that lives outside of a table box and its caption, as defined in CSS2 section 17.4. I'm not talking about the anonymous table "wrapper" that might be generated to contain a naked <td> element, for example.

@gregwhitworth gregwhitworth added css-tables-3 Current Work css-align-3 Current Work css-flexbox-1 Current Work labels Oct 20, 2016
@gregwhitworth
Copy link
Contributor

Somewhat related to this, is this discussion - albeit about composited based properties #324

@yisibl
Copy link
Contributor

yisibl commented Nov 25, 2016

Oper 12 almost all flex item (with display: table) elements are rendered in line with expectations.

image

@fantasai
Copy link
Collaborator

fantasai commented Nov 26, 2016

Yes, you're right about the spirit of the split: all new properties, if they apply to tables at all, need to specify whether they apply to the table box or the table wrapper box (because they don't apply to both certainly), and the alignment properties, grid placement properties, and flex clearly belong to the wrapper box category. CSS2.1 can only make this judgement for properties in CSS2.1.

I'm not sure, atm, what's a good way of representing this information. :) It falls along the lines of "does this property apply to ::first-line"?

@tabatkins
Copy link
Member

Looks like we had text for this in the past, but deleted it: https://drafts.csswg.org/css-flexbox/#change-2015-anonymous-fixup. I assume that we accidentally assumed the references to "table wrapper box" were referring to the anonymous table box that gets wrapped around bare table-cells/etc during box-tree fixup.

Should we just restore it? Everyone's interoperable, but with clearly wrong behavior.

@FremyCompany
Copy link
Contributor

My opinion is the other thread (#948).

TLDR: I am fine with adding text to hoist flex/align-*/etc in the tables spec, I just continue to think it would be easier to stop pretending we don't just want the table-wrapper box to be the box generated for the <table> element. We are bothering ourselves with a box that is absolutely not useful and creates ton of implementation complexity. If someone proposed this non-sense today, everybody would be objecting to it.

@FremyCompany
Copy link
Contributor

FremyCompany commented Feb 8, 2017

FWIW it has been resolved in today's call to restore the deleted text in flex, and continue to work on a more general level in another, separate github issue. I'll crosslink that new issue here when I get to file it.

@fantasai fantasai added Commenter Satisfied Commenter has indicated satisfaction with the resolution / edits. Commenter Timed Out (Assumed Satisfied) and removed Commenter Satisfied Commenter has indicated satisfaction with the resolution / edits. labels May 2, 2017
@fantasai fantasai added this to the Published css-flexbox-1 2017-10-19 milestone Mar 29, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

7 participants