We help IT Professionals succeed at work.

Check out our new AWS podcast with Certified Expert, Phil Phillips! Listen to "How to Execute a Seamless AWS Migration" on EE or on your favorite podcast platform. Listen Now


Best method to style SELECT

Medium Priority
Last Modified: 2012-05-11

I have seen a bunch of ways to customize a html select element. Any ideas on what would be the best method to do this with minimal code?

Watch Question

Unlock this solution with a free trial preview.
(No credit card required)
Get Preview
Then I can add this background image right?


 Select bg
So far so good. I have this:

select {
  background: none repeat scroll 0 0 transparent;
  border: 0 none;
  color: #494949;
  padding: 6px 10px 0;
  width: 291px;
overflow: hidden;     
width: 350px;     
-moz-border-radius: 9px 9px 9px 9px;     
-webkit-border-radius: 9px 9px 9px 9px;     
border-radius: 9px 9px 9px 9px;     
box-shadow: 1px 1px 11px #330033;     
background: url("../images/form/select_bg.gif") no-repeat scroll 0 0 transparent;     

Open in new window

Image:image select
Any ideas on how I can get the arrows on the image to show not the default element arrow.
Hey, any ideas? Still can't get it to work.
Hey...any ideas on how I can get the default arrows to go away?
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a free trial preview!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.


Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.