JSFiddle - React, Tailwind, and code Playground

by aldomatic

HTML

<select id="birthDate.dateYear" name="birthDate.dateYear" >
             <option value="">Year</option>
             
             	<option value="2004">asdf afasfasfasfdasdfdadsfdasfasdfdasfdasfdasdfafasdf </option>
             
             	<option value="2003">2003</option>
             
             	<option value="2002">2002</option>
             
             	<option value="2001">2001</option>
             
             	<option value="2000">2000</option>
             
             	<option value="1999">1999</option>
             
             	<option value="1998">1998</option>
             
             	<option value="1997">1997</option>
             
             	<option value="1996">1996</option>
             
             	<option value="1995">1995</option>
             
             	<option value="1994">1994</option>
             
             	<option value="1993">1993</option>
             
             	<option value="1992">1992</option>
             
             	<option value="1991">1991</option>
             
             	<option value="1990">1990</option>
             
             	<option value="1989">1989</option>
             
             	<option value="1988">1988</option>
             
             	<option value="1987">1987</option>
             
             	<option value="1986">1986</option>
             
             	<option value="1985">1985</option>
             
             	<option value="1984">1984</option>
             
             	<option value="1983">1983</option>
             
             	<option value="1982">1982</option>
             
             	<option value="1981">1981</option>
             
             	<option value="1980">1980</option>
             
             	<option value="1979">1979</option>
             
             	<option value="1978">1978</option>
             
             	<option value="1977">1977</option>
             
             	<option value="1976">1976</option>
             
  ...

CSS

select {
      -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-color: #fafafa;
    height: 45px;
    width: 100%;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAUCAMAAACtdX32AAAAdVBMVEUAAAD///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAhMdQaAAAAJ3RSTlMAAAECAwQGBwsOFBwkJTg5RUZ4eYCHkJefpaytrsXGy8zW3+Do8vNn0bsyAAAAYElEQVR42tXROwJDQAAA0Ymw1p9kiT+L5P5HVEi3qJn2lcPjtIuzUIJ/rhIGy762N3XaThqMN1ZPALsZPEzG1x8LrFL77DHBnEMxBewz0fJ6LyFHTPL7xhwzWYrJ9z22AqmQBV757MHfAAAAAElFTkSuQmCC);
    background-position: 100%;
    background-repeat: no-repeat;
    border: 1px solid #ccc;
    padding: 0.5rem;
    border-radius: 0;
}