JSFiddle - React, Tailwind, and code Playground

by MadhawaMB

HTML

<div class="styled-offer">
  

<select class="form-control offer-select" id="frmMaand" name="type">
    <option value="1" class="disabled-option   selected" hidden selected  >
        <span>Select an option</span>
    </option>
    <option value="value1" >Option 1</option>
    <option value="value2">Option 2</option>
    <option value="value3">Option 3</option>
    <option value="value4">Option 4</option>
</select>

</div>

CSS

option {
  color:#999;
}

/* NOT working */
option:selected {
  color:blue;
}

.styled-offer select.offer-select {
    color: #F00;
  }
  .styled-offer select.offer-select option {
    color: #333;
  }