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

Percentage height quirk should apply to flex and grid items #76

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions quirks.bs
Original file line number Diff line number Diff line change
Expand Up @@ -237,8 +237,8 @@ the first step that returns a value:
''height/auto'', then return |element|.

<li><p>If |element| has a <a>computed value</a> of the 'position' property that is
''position/absolute'', or if |element| is a not a <a>block container</a> or a
<a>table wrapper box</a>, then return |element|.
''position/absolute'', or if |element| is a not a <a>block box</a>, a
<a>table wrapper box</a>, a <a>flex item</a>, or a <a>grid item</a>, then return |element|.
Comment on lines +240 to +241
Copy link

@Loirooriol Loirooriol Nov 7, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be restricting the quirk rather than applying it more frequently...
So we need to return element if some of these conditions holds:

  • computed value of position is absolute
  • element is not a block box nor an inline-block
  • element is a flex item or grid item

The 3rd condition is superfluous, but the CSSWG wanted to be extra explicit 🤷

In CSS2 table wrapper boxes are either block boxes or inline-block boxes as per https://drafts.csswg.org/css2/#model, so I think the above handles them well. If you want to be extra explicit, the 2nd condition should be

  • element is not a block box, nor an inline-block, nor a block-level or inline-level table wrapper box

E.g. if we add display: masonry, a masonry-level table wrapper box will not be covered by the 3rd condition, so it should be covered by the 2nd one, so it can't exclude all table wrapper boxes.


<li><p>Jump to the first step.

Expand Down