CSS Only Custom Select Control

This is a custom alternative to a basic SELECT element, that can be easily customised to different applications.

It uses the ::checked and Sibling Selector Technique so that it does not require any javascript to function. Even if the CSS is not loaded it will degraded back to a standard radio options list

Examples

Basic Select…

A little more style…

Hierarchical Options

HTML

CSS

Browser Support

30+ 24+ 8+ 6+ 12+ 3.2+ 2.1+

Licence

Creative Commons BY-SA

[gp-comments]
Top