1

I tried adding the icon by using the

::after

selector, of

 option:checked

but that didn't work, apparently, they don't have an after (maybe, I tired *::after that didn't caused any change)

<select>
  <option>
    abc
  </option>
  <option>
    bc
  </option>
  <option>
    c
  </option>

</select>
<style>
option:checked::after {
content:'\2713';
}
</style>
No Name
  • 98
  • 1
  • 11
  • 1
    your code works, the `pseudo :after` is appended in your HTML (you can verify with web-developer tools). The problem is the ` – caramba Jun 22 '21 at 09:10
  • Thanks for inspecting it. I want a tick icon next to the option name. Any idea on what do to next? – No Name Jun 22 '21 at 09:12
  • 2
    `::after` is supposed to work as if an actual child element had been inserted into the element - but `option` elements can not _have_ children, their content model is text only. (Some browsers _might_ support this, Firefox f.e. does in a similar way with `img` elements IIRC, but don’t rely on it.) Either work with a background image here to apply your “icon”, or use JavaScript to insert it into the actual text content of the selected option. – CBroe Jun 22 '21 at 09:16
  • Actually yes that answers, unfortunately we can't edit it.thanks @cloned – No Name Jun 22 '21 at 16:25

0 Answers0