🔗 The Goldilocks customizable select height

A new approach to enhancing the select element focuses on a customizable height that meets user expectations. Jake Archibald opens the discussion with his experiences from a recent talk where he attempted to style the select element effectively using CSS. This exploration highlights a common sizing pattern that many developers desire but often struggle to achieve. The article addresses specific browser discrepancies, particularly with Firefox and Safari, and proposes solutions involving CSS properties like max-block-size and calc-size(). Archibald recommends creating better user experiences by ensuring that dropdowns do not overflow or appear too small. By implementing margins and setting minimum and maximum sizes based on context, developers can refine the usability of customized dropdowns, ultimately making them more user-friendly across browsers.