JSFiddle - React, Tailwind, and code Playground

HTML

<html>
  <div class="select-wrapper">
    <select>
      <option>One - A long option that gets cut off</option>
      <option>Two - A long option that gets cut off</option>
    </select>
  </div>
</html>

CSS

select {
    width:100px; 
}

.select-wrapper {
    width:100px; 
    position: relative;
}

.select-wrapper::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 100px;
  height: 100%;
  content: "";
  background: linear-gradient(to right, transparent, white);
  pointer-events: none;
}