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-3] Do the CSS2.1 rules apply for determining the last-baseline of flex/grid/etc ? #7638

Open
bfgeek opened this issue Aug 23, 2022 · 1 comment
Labels
css-align-3 Current Work

Comments

@bfgeek
Copy link

bfgeek commented Aug 23, 2022

CSS2.1 has a "fun" rule:

https://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#q10.0
"The baseline of an 'inline-block' is the baseline of its last line box in the normal flow, unless it has either no in-flow line boxes or if its 'overflow' property has a computed value other than 'visible', in which case the baseline is the bottom margin edge."

Does this rule impact "align-self: last baseline" ? And if so how?

For reference - Firefox appears to be setting to the block-end border-box edge when "overflow:hidden" is present.
https://www.software.hixie.ch/utilities/js/live-dom-viewer/?saved=10609

@fantasai @tabatkins

@bfgeek bfgeek added the css-align-3 Current Work label Aug 23, 2022
@fantasai
Copy link
Collaborator

fantasai commented Aug 29, 2022

We also have this CSS2.1 issue, fwiw:
#2781

So, options:

  • Give first-baseline this weird behavior, take the desired behavior for last-baseline.
    • This would put the last baseline above the first in many cases.
  • Give both first and last-baseline this weird behavior
    • Consistent but not awesome.
  • If baseline-source is auto, do the weird thing, otherwise use the desired behavior.
    • Lets us opt out of weirdness and use the real baseline.

Desired behavior being: use the actual baseline if it's above the box’s bottom edge, and clamp it to that position if it overflows. See #7660

Either way, I don't think we need to import this weirdness into flex and grid formatting contexts.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
css-align-3 Current Work
Projects
None yet
Development

No branches or pull requests

2 participants