Re: [csswg-drafts] [css-forms-1] UA styles for base appearance listbox select elements (#12510)

> For that to work right, you'd need something like:
> 
> #container > div {
>   display: flow-root;
> }

Option elements already have display:flex for base appearance for ::checkmark. I'm guessing flow-root would make it not a flexbox anymore?

The proposed calc() for block-size fits options correctly as long as they are one line and the padding isn't changed - you can change the font-size to something that makes it bigger than 24px.

Even if calc() isn't perfect when the option has multiple lines or custom padding, I think that's ok. I don't believe that this is something authors will care much about since libraries (which I could find in a few minutes) don't offer a way to set the height to a specific number of options:
- https://material.angular.dev/cdk/listbox/overview
- https://primereact.org/listbox/
- https://react-spectrum.adobe.com/react-aria/ListBox.html

I also echo what Mason said in the last meeting, which is that most listboxes I see on the web aren't sized to fit an exact number of options and that it helps to indicate that it is scrollable.

-- 
GitHub Notification of comment by josepharhar
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12510#issuecomment-3458913990 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 28 October 2025 23:10:38 UTC