Skip to content Skip to sidebar Skip to footer

Remove The Button Inside The Dropdownlist

Is there a way to hide or remove the arrow button inside a dropdownlist?

Solution 1:

Yes, at least in webkit: http://jsfiddle.net/zzTjy/1/.

HTML

<select><option>123</option></select>

CSS

SELECT { -webkit-appearance: none; }

It's worth noting that Mozilla supports -moz-appearance, but it doesn't hide the arrow in the dropdown list. This has been an open issue for quite some time.

Mozilla also states:

Do not use this property on Web sites: not only is it non-standard, but its behavior change from one browser to another.

This may be a bit draconian, but you certainly shouldn't use appearance to change the expected behavior of the element.

Further Reading

Post a Comment for "Remove The Button Inside The Dropdownlist"