Question

Not sure if this can be done but can I split the text in the option tags?

Example, normal styling:

<select>
    <option value="">First - A</option>
    <option value="">Car - B</option>
    <option value="">Black - C</option>
    <option value="">Super Duper - D</option>
</select>

How can I get it to look like this:

<select>
    <option value="">First       - A</option>
    <option value="">Car         - B</option>
    <option value="">Black       - C</option>
    <option value="">Super Duper - D</option>
</select>

I’ve tried added a span tag nested in the option tag but that didn’t work

Answer 1

<option> tags do not accept HTML content. You can only pad your selections with spaces to format them.

Alternately, there are plug-in replacements for <select> that use DIVs and ULs instead of <select> that give you more flexibility.