Remove drop-down arrow from <select> element?
64,722
Try seeing this:
How to remove the arrow from a select element in Firefox
Coincidentally my comment:
"Tried encapsulating that in a div with overflow hidden? Div will have width < Width of select."
is similar to the highest voted answer.
Author by
AlGallaf
Updated on January 23, 2020Comments
-
AlGallaf over 4 years
Possible Duplicate:
How to remove the arrow from a <select> tag in FirefoxThe arrow only disappears in Chrome. Here is the script that I'm using:
<style type="text/css"> select { font-family: 'Viga', sans-serif; font-size:16px; color:#168ACB; padding: 5px 10px 5px 10px; margin: 0px 5px 5px 5px; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; -webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #eaeaea inset; -moz-box-shadow: 0 3px 0 #ccc, 0 -1px #eaeaea inset; box-shadow: 0 3px 0 #ccc, 0 -1px #eaeaea inset; background: #f8f8f8; border:none; outline:none; display: inline-block; -webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:pointer; } </style>
Chrome: http://i.imgur.com/Ocpux.png Firefox & IE: http://i.imgur.com/5zGuX.png