I want to make the second select box arrow become the same with the first one. But I have no idea why they are different, because I didn’t style the arrow.
Share
Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I want to make the second select box arrow become the same with the first one. But I have no idea why they are different, because I didn’t style the arrow.
Browsers and OS’s determine the style of the select boxes in most cases, and it’s next to impossible to alter them with CSS alone. You’ll have to look into replacement methods. The main trick is to apply
appearance: nonewhich lets you override some of the styling.My favourite method is this one:
http://cssdeck.com/item/265/styling-select-box-with-css3
It doesn’t replace the OS select menu UI element so all the problems related to doing that are non-existant (not being able to break out of the browser window with a long list being the main one).
Good luck 🙂