html - ボックスオプションのスタイルを選択して、境界線を削除します

Question

選択ボックスのオプションから境界線を削除しようとしていますが、border:0px;オプションに入れても機能しません。Select 要素自体はすべてのブラウザーで同じように見えますが、クリックして開くと、下のオプションは境界線で表示され、幅とパディングはブラウザーごとに異なります。

オプションから境界線を削除し、CSS を使用してすべてのブラウザーで同じように見せる方法はありますか?

ありがとう

HTML

<div class="field_element">
   <select name="select_administrator">
    <option value="NO">NO</option>
    <option value="YES">YES</option>
   </select>
</div>

CSS

.field_element select
{
    font-family: Arial,'DejaVu Sans','Liberation Sans',Freesans,sans-serif;
    font-size: 12px;
    color: #5d5d5d;
    outline: none;
    background-color: #ffffff;
    border: 1px solid #DDDDDD;
    padding: 3px;
    border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
}
.field_element option
{
    padding: 0px 3px 0px 3px;
}