JSFiddle - React, Tailwind, and code Playground

HTML

<div class="selector" id="selector" style="float:right;">
        <select title="sort-results" id="sortResults" name="PriceDropDown" class="listSort styled_forms perPageSelector" style="opacity:1.0; width:140px;">
            <option value="20">20 per page</option>
            <option value="40">40 per page</option>
            <option value="60">60 per page</option>
            <option value="80">80 per page</option>
            <option value="100">100 per page</option>
            <option value="120">120 per page</option>            
        </select>
    </div>

CSS

#selector:focus{ 
      outline: #177f7f dotted medium; 
 }

#selector:hover{ --> works!!!
       outline: #177f7f dotted medium; 
  }

#sortResults:focus{ 
        outline: #177f7f dotted medium; 
 }