How to style asp.net dropdownlist

Try the following code

HTML

<asp:DropDownList ID="DropDownList1" runat="server" Width="120px" BackColor="#F6F1DB" ForeColor="#7d6754" Font-Names="Andalus" CssClass="ddl">    <asp:ListItem Text="DEPART FROM"></asp:ListItem></asp:DropDownList>

CSS
EDIT

<style type="text/css">        .ddl        {            border:2px solid #7d6754;            border-radius:5px;            padding:3px;            -webkit-appearance: none;             background-image:url('Images/Arrowhead-Down-01.png');            background-position:88px;            background-repeat:no-repeat;            text-indent: 0.01px;/*In Firefox*/            text-overflow: '';/*In Firefox*/        }</style>

Check the screenshot which I got in Chrome also I am attaching the dropdown down arrow image(Arrowhead-Down-01.png).Hope this helps you.

Screenshot

Arrowhead-Down-01.png

HTML select solution

HTML

<div class="styled-select">  <select>    <option>DEPART FROM</option>    <option>DEPART TO</option>    <option>DEPART AWAY</option>  </select></div>

CSS

  .styled-select {   width: 150px;   height: 30px;   overflow: hidden;   background: url('Images/Arrowhead-Down-01.png') no-repeat right #F6F1DB;   border: 2px solid #7d6754;   border-radius: 5px;   }   .styled-select select {   background: transparent;   width: 180px;   padding: 3px;   font-size: 16px;   line-height: 1;   border: 0;   border-radius: 0;   height: 30px;   -webkit-appearance: none;   font-family:Andalus;   color:#7d6754;   }