Fully customise your select elements

For years and years, developers have had to come up with all sorts of creative workarounds to style <select> dropdown menus. I covered this a good while ago in Form styling limitations are an accessibility issue, and I can’t tell you how excited I was when Safari 27 included ‘Customisable Select’, following Chrome’s lead from early last year. A false start Some years ago, there was a proposal for a new <selectmenu> HTML element. That would have meant replacing existing <select>s to take advantage of it, and working out what to show people whose browsers didn’t support the new element. The approach we’ve ended up with builds on <select> instead, which makes things much simpler. Now we can do it properly If you’re already using <select> and have styled it as far as browsers allowed, there’s just some CSS to rewrite. Now, browsers that support the new styling get your custom design; those that don’t show their default <select>. A bit ugly, perhaps, but entirely usable. Of course,…