-webkit-aussehen: keine Dropdown-Symbol Ausgabe

Question

Um Safari Drop-Down-Styling-Problem zu beheben hinzugefügt -webkit-Aussehen: keine. Dieses entfernte Dropdown-Symbol (kleiner Pfeil nach unten) in Chrome und anderen Browsern.

Wie können wir das beheben?

Answer 1

Beispiel für:

1) Styled Dropdown in Auswahlbox

<div class="myBox"> 
    <select class="mySelect" name="currency"> 
    <option value="Please_select" selected> Please select</option> 
    <option value="aud">AUD</option> 
    <option value="usd">USD</option> 
    <option value="eur">EUR</option> 
    <option value="gbp">GBP</option> 
    <option value="jpy">JPY</option> 
    <option value="nzd">NZD</option> 
    </select> 
</div> 

.myBox{ 
    position: relative; 
    display: inline-block; 
    margin: 5px; 
} 
.myBox:after { 
    content: "▼"; 
    width: 25px; 
    height: 20px; 
    background:#fff; 
    display: block; 
    position: absolute; 
    text-align:center; 
    color:#999; 
    font-size:14px; 
    top: 5px; 
    right: 0; 
    z-index: 1; 
} 
.mySelect{ 
    border: 0; 
    background: #fff; 
    outline: none; 
    margin: 0; 
    padding: 5px; 
    min-width: 410px; 
    vertical-align: middle; 
    position: relative; 
    appearance: none; 
    -moz-appearance: none; 
    -webkit-appearance: none; 
} 

2) Stellen Sie keine Drop-Down-

.myBox:after { 
     content: ""; 
     width: 25px; 
     height: 25px; 
     background:#fff; 
     display: block; 
     position: absolute; 
     text-align:center; 
     color:#999; 
     font-size:14px; 
     top: 0; 
     right: 0; 
     z-index: 1; 
    } 

https://jsfiddle.net/f9ju0gdk/