css - css3でドロップダウンメニューをスタイリングする

Question

次のコードは見栄えがよく、ほとんど機能します

select{
   width:218px;
   background-color: #000;
   border:none;
   outline: none;
   color:#333; 
   -webkit-appearance:none;
   height:24px;
   border-radius: 0;
   -webkit-border-top-left-radius: 5px;
   -webkit-border-bottom-left-radius: 5px;
   border-top-left-radius: 5px;
   border-bottom-left-radius: 5px;
}

.selcet_wrapper{
   background:url(../image/contact_arrow.png) no-repeat 96% 0;
   background-size: 21px 24px;
   overflow: hidden;
   -webkit-border-top-right-radius: 5px;
   -webkit-border-bottom-right-radius: 5px;
   border-top-right-radius: 5px;
   border-bottom-right-radius: 5px;
   width:21px;
   height:24px;

}

<div class="selcet_wrapper">
  <select name="how" id="how">
  <option selected="selected" value="audi">What is your enquiry regarding?</option>
  <option value="volvo">one</option>
  <option value="saab">two</option>
  <option value="vw">three</option>
  </select>
</div> 

bg 画像をクリックしてもドロップダウンが表示されず、select 要素に含まれていないことがわかっています。これを回避する方法はありますか?