スタイリングモバイルブラウザに適したドロップダウンメニューを選択

Question

おはようございます！私は（今すなわち特にiPhone）モバイルデバイス向けの私の現在のデザインにフィットするドロップダウン選択メニューのスタイルを設定するために、現時点で苦労してる

は

これはどのようにそれをあります現時点で私のiPod

に、これはそれがGoogle Chromeの

0123上で、現時点でどのように見えるかであるように見えます

私は本当にiPodの選択ドロップダウン可能な場合は、テキストフィールドで実証されたデスクトップのドロップダウンをミラーリングするが、私はハードポイントで立ち往生しているようです。

私は以下の使用している現在のCSSコードを見つけてください：

/************************************************************************ 
FORM STYLING 
*************************************************************************/ 
button.button{ 
    font-size: 14px; 
    font-weight: bold; 
    background-color: #333; 
    width: 95%; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    padding: 10px; 
    text-align: center; 
    color: #CCC; 
    border: none; 
} 
input, textarea{ 
    font-family:Helvetica,Arial,sans-serif; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    color:#555555; 
    background:#FBFBFB none repeat scroll 0 0; 
    border:1px solid #E5E5E5; 
    font-size:12px; 
    line-height: 16px; 
    margin-bottom:16px; 
    margin-right:6px; 
    margin-top:2px; 
    padding:10px; 
    display: block; 
    width: 92%; 
} 
select { 
    font-family:Helvetica,Arial,sans-serif; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    color:#555555; 
    background:#FBFBFB none repeat scroll 0 0; 
    border:1px solid #E5E5E5; 
    font-size:12px; 
    line-height: 16px; 
    margin-bottom:16px; 
    margin-right:6px; 
    margin-top:2px; 
    padding:10px; 
    display: inline-block; 
    width: 30%; 
} 
label{ 
    font-size: 12px; 
    font-weight: bold; 
    color:#5B5A5A; 
    display: block; 
} 
    label span, .required { 
     color: #C00;  
    } 

私は、このCSSの難問を解決するための任意の助けをいただければ幸いです！事前

Answer 1

で

多くのおかげで37本の信号により、この記事では、独自のCSSが優先されます前に、WebKitのスタイルのCSSのリセットを使用しなければならないことを説明しています。優れたコード例を提供します。 http://37signals.com/svn/posts/2609-customizing-web-forms-with-css3-and-webkit