HTML選擇（下拉）在Chrome

Question

工作不同

有一個選擇元素在一個頁面，它的工作在Firefox真棒，但很噁心谷歌瀏覽器..

火狐卡

谷歌瀏覽器管理單元

..

HTML

 <select id="dropDown" class="dropDown"> 
      <option>Design & Creative</option> 
      <option>Share Point Developer</option> 
      <option>Software Development Engineer</option> 
      <option>Silverlight Developer</option> 
      <option>Dot Net Developer</option> 
      <option>Quality Assurance</option> 
      <option>Mobile Application</option> 
      <option>IT Sales</option> 
     </select> 

CSS

.dropDown { 
    -webkit-appearance: none; 
    height: 60px; 
    width: 450px; 
    background: #c03400; 
    font-size: 12pt; 
    color: #fff; 
    border: none; 
    outline: none; 
    padding: 20px 15px; 
    display: block; 
    clear: both; 

} 

.dropDown option { 
    -webkit-appearance: none; 
    height: 10px; 
    padding: 10px; 
    color: #626262; 
    background: #f5f3f3; 
    outline: none; 
    padding: 10px 15px; 
    display: block; 
    box-shadow: none; 
    border: none; 
} 

.dropDown:hover, .dropDown:focus { 
    background: #a62e01; 
} 

Answer 1

在鉻的尺寸差異是由於高度屬性。您無法在Google Chrome中設置選項元素的高度。 How can I control the height of an Option element in Webkit?