0

I have a dropdown / combobox that I would like to style the option tag and show a tooltip on hover here is my code.

here is my html:

<select class="primary" name="primary" width="14%">
  <option> -- Select -- </option>
  <option data-tooltip="test 1" title="1 long description" value="1"> test 1</option>
  <option data-tooltip="test 2" title="2 medium description" value="1"> test 2</option>
</select>

here is my css

option[title]:hover:after{
    content: attr(title);
     background: red; 
     color: white;
     display:block;
     position:absolute;
     top:0;
     right:-100%;
}

What advise and suggestion you can advise me.

Things I tried:

  • using a span tag on option and set a hover (but upon research span tags dont necessarily work within option tag)
  • using data attr to try to show tooltip
Kants
  • 21
  • 6
  • Is this what you're looking for? https://stackoverflow.com/questions/3249591/how-can-i-display-a-tooltip-on-an-html-option-tag – User160 Sep 07 '22 at 14:27

0 Answers0