How to remove the dropdown arrow from a select element

 

How to remove a dropdown arrow and need to apply custom image for select element in the form. So you have to get the solution and use this is the below css that will help you to change dropdown arrow. below is example that will help you to clearify your doubt.

HTML Code

<select id="dropdown">
 <option>Mumbai</option>
    <option>Delhi</option>
    <option>Chennai</option>
    <option>kolkata</option>
</select>

CSS Code

#dropdown {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 2px 30px 2px 2px;
    border: none;
    background: transparent url("http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png") no-repeat right center;
  }