firefox CSSオプションのスタイルが正しく動作しない

Question

CSSを使用してオプションの選択ボックススタイルを変更しようとしています。

Google Chromeではすべてうまく動作しますが、スタイルはMozilla Firefoxでは機能しません。

Mozilla FirefoxでもCSSコードを動作させるには、ここで何が欠けていますか？

誰でもこの点について私を助けることができますか？

私のコメントを1として

.container { 
 
    position:relative; 
 
    width:100%; 
 
    max-width:500px; 
 
    margin:0px auto; 
 
    margin-top:100px; 
 
    padding:40px; 
 
    background-color:#fafafa; 
 
    border:1px solid #d8dbdf; 
 
    -webkit-box-orient: horizontal; 
 
    -webkit-box-direction: normal; 
 
    -webkit-flex-direction: row; 
 
    -ms-flex-direction: row; 
 
    flex-direction: row; 
 
    -webkit-box-align: stretch; 
 
    -webkit-align-items: stretch; 
 
    -ms-flex-align: stretch; 
 
    align-items: stretch; 
 
    display: -webkit-box; 
 
    display: -webkit-flex; 
 
    display: -ms-flexbox; 
 
    display: flex; 
 
} 
 

 
.i_bd select { 
 
    background-color: rgb(255, 255, 255,1) !important; 
 
    border-radius:3px; 
 
    -webkit-border-radius:3px; 
 
    -moz-border-radius:3px; 
 
    padding:18px; 
 
    color:#333333; 
 
    font-size:13px; 
 
    font-weight:500; 
 
    outline:none; 
 
    border: 1px solid rgba(239, 239, 239, 1); 
 
    width:80px; 
 
    height:30px; \t 
 

 
} 
 

 
.i_bd { 
 
    \t -webkit-box-flex: 1; 
 
    -webkit-flex-grow: 1; 
 
    -ms-flex-positive: 1; 
 
    flex-grow: 1; 
 
    -webkit-flex-shrink: 1; 
 
    -ms-flex-negative: 1; 
 
    flex-shrink: 1; 
 
    position: relative; 
 
\t float:left; 
 
\t margin-right:10px; 
 
}

<div class="container"> 
 
    <div class="i_bd"> 
 
     <select name="select"> 
 
     <option value="1">1</option> 
 
     <option value="2">2</option> 
 
     <option value="3">3</option> 
 
     <option value="4">4</option> 
 
     </select> 
 
    </div> 
 
</div>