- From: Malix - Alix Brunet via GitHub <noreply@w3.org>
- Date: Fri, 17 Jul 2026 00:48:33 +0000
- To: public-css-archive@w3.org
As a web developer working on migrating standard dropdowns to the new customizable select API (`appearance: base-select`), I wanted to share some feedback regarding the default sizing behavior. With standard selects, the browser automatically sizes the trigger button to match the width of the widest `<option>`, preventing layout shifts when the selection changes. However, when opting into `appearance: base-select`, this legacy behavior is lost, and the select button defaults to a fluid width that fits only the currently selected option. To prevent layout jank when options of varying lengths are selected, we currently have to choose between: 1. Setting a hardcoded `width` or `min-width` in CSS, which is less responsive to dynamic option content. 2. Implementing complex workarounds, such as using `display: inline-grid` overlay sizer elements (hidden proxies) or ResizeObservers to sync widths. Having a native CSS mechanism (or UA style default) to preserve the 'size to widest option' behavior for customizable select elements would significantly improve developer experience and layout stability. -- GitHub Notification of comment by Malix-Labs Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11838#issuecomment-4997901154 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Friday, 17 July 2026 00:48:34 UTC