Hoe to Style the Arrow on a Select Input Field
Sep 26, 2022 | CSS
<!---- HTML ---->
<div class="container">
<select>
<option selected> Select Box </option>
<option>Option 1</option>
<option>Option 2</option>
<option>Last long option</option>
</select>
</div>
<!---- CSS ---->
.container select{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
select.class::-ms-expand {
display: none;
}
.container:after{
color: #535353 !important;
content: '\43';
font-size: 21px;
right: 20px;
margin-top: 12px;
position: absolute;
pointer-events: none;
}