When I use transform: rotate() the whole button is rotated, not just the image, I thought of create a div to wrap the image, rotate this div and position it above the button, but it feel wrong, there has to be another way.
select{
border: 1px solid #ccc;
padding: 5px 35px 5px 5px;
width:150px;
height: 40px;
background-color: #eee;
color: black;
font-size: 16px;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
background: url(https://image.flaticon.com/icons/svg/660/660570.svg) 90% / 12% no-repeat #eee ;
}<select>
<optgroup label="Ultra Secret">
<option>007</option>
<option selected>MIB</option>
<option>u mom Alien</option>
<option>no u</option>
</optgroup>
<optgroup label="Something Important">
<option>Item 1</option>
<option>Item 2</option>
<option>Item 3</option>
<option>Item 4</option>
<option>Item 5</option>
</optgroup>
</select>
