HTML quick maffs
If you want to have a placeholder for native <select> element, just do the following:
<option value="" selected disabled hidden>Choose...</option>

It will make a native placeholder that:
- is accessible and readable by screen reader
- doesn't show up in options list
- allows native validation with "required" attribute (note the empty value attribute in the placeholder option).

It's unfortunate that we don't have it the way we have placeholder in inputs, but this is the next best thing.

Add Comment