JSFiddle - React, Tailwind, and code Playground

HTML

<!--[if IE]>
   <div class="selectboxIE">
    <label>
        <select >
            <option  value="val1">Select 1</option>
            <option value="val2">Select 2</option>
            <option value="val3">Select 3</option>
        </select>
    </label>
</div>
<![endif]-->
<![if !IE]>
   <select  class="dropDown">
    <option>mango</option>
    <option>banana</option>
    <option>pomegranate</option>
    <option>papaya</option>
</select>
<![endif]>

CSS

body 
{
    font-size: 18pt;
}

/**IE**/
.selectboxIE
{
    position: relative;
    width: 200px;
    height: 200px
     
}

.selectboxIE label 
{
    display: inline-block;
    position: absolute;
    right: 0;
    height: 23px;
}

.selectboxIE label:after 
{
    content: '';
    width: 17px;
    height: 23px;
    position: absolute;
    right: 0px;
    color: #868583;
    background: white;
    border-left: 1px solid #868583;
    padding-left: 2px;
}

.selectboxIE label > select 
{
    float: right;
    background: transparent;
    border: 1px solid #575757;
    color: #575757;
    font-size: 14px;
    letter-spacing: 2px;
    font-family: Arial;
    height: 100%;
}

.selectboxIE select::-moz-focus-inner {
  border: 0;
}

.selectboxIE select:focus
{
  outline: none;
}
/**End IE**/

.dropDown 
{
    outline : none;
    overflow : hidden;
    text-indent : 0.01px;
    text-overflow : '';
    background : #666;

    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.dropDown::-ms-expand
{
    display: none;
}