css select (dropdown) custom styles

<select>
    <option value="1">options 1</option>
    <option value="2">options 2</option>
    <option value="3">options 3</option>
</select>

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #555;
    width: 80%;
    height: 34px;
    background: #eee url(http://www.stackoverflow.com/favicon.ico) right center no-repeat;
}
 
select::-ms-expand { /* for IE 11 */
    display: none;
}

<div class="dropdown-styled">
    <select>
        <option value="1">options 1</option>
        <option value="2">options 2</option>
        <option value="3">options 3</option>
    </select>
</div>

.dropdown-styled {
    width: 80%;
    height: 34px;
    overflow: hidden;
    background: #eee url(http://www.stackoverflow.com/favicon.ico) right center no-repeat;
    border: 1px solid #555;
}
 
.dropdown-styled select {
    background: transparent;
    width: 110%;
    height: 34px;
    border: 0;    
}