custom drop down not working IE and Firefox

Question

I have a custom img for my dropdown option menu and i tried other browser like Internet Explorer and FireFox...

My Code:

textarea {
    background: #9d9d9d;
    color: #000000;
    width: 90%;
    padding: 5px;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
}
.styled-select {
   width: 88%;
   height: 30px;
   overflow: hidden;
   background: url('../img/down.png') no-repeat right #9d9d9d;
   border: 1px solid #ccc;
   border-radius:5px;
   -moz-border-radius:5px;
   -webkit-border-radius:5px;
}

This is the drop down on firefox

This is the Drop Down on Internet Explorer

First Img is for Firefox the Second img is for Internet Explorer

Please provide us with your html code. Because it seems like a select element where as you use textarea in your css. — nkmol, Nov 06 '13 at 11:24
duplicate: http://stackoverflow.com/questions/6787667/what-is-the-correct-moz-appearance-value-to-hide-dropdown-arrow-of-a-select — javaNoober, Nov 06 '13 at 12:56

score 1 · Accepted Answer · edited Feb 27 '14 at 18:42

1

For I.E:

select::-ms-expand
{  
 display: none;
}

For Firefox:

.select
{
-moz-appearance: none; 
 appearance: none;    
 text-overflow: ''; 
}

edited Feb 27 '14 at 18:42

Dan

2,701
1
29
34

answered Feb 27 '14 at 18:13

Caio César

26
2

custom drop down not working IE and Firefox

1 Answers1