Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Help with two styles to a contact form, please. Reply To: Help with two styles to a contact form, please.

#175327
paulob
Participant

Hi,

The best thing is just to give the select a solid background colour as default and then apply the gradient as per normal for browsers that understand it. You can’t however change the arrow button unless you want to get into a lot of pre-fixed browser code or use a lot of hacks.

If you really want to style it cross browser then you will need one of those select replacement scripts that swap out the select for a styled list which you can style as you want and the js swaps the content in and out of the real select in the background.

I had a go at styling the select and you can get reasonable results for modern browsers but you have to jump through hoops to leave it in a working state for older browsers.

http://codepen.io/paulobrien/full/vdKax/

Suffice to say that in most cases its best to leave it alone or just apply simple styling :)