Chapter Seventeen. Select Menu

Native select elements look pretty simple, but in fact are robust and sophisticated widgets: they include a host of interaction features such as keyboard mapping for navigating and selecting options, single-letter type-ahead, and scroll-wheel support, to name a few.

Often a design will call for a custom look and feel for a dropdown select menu. It would be ideal if you could simply use CSS to style a standard select element and preserve the native functionality that web users have come to expect. However, browsers offer very limited support for styling these elements—styles are defined per browser (including text style and size, box outline and arrow style, dropdown options menu format, and scrollbar), and are ...

Get Designing with Progressive Enhancement: Building the Web that Works for Everyone now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.