Hi All, any idea on how to sthyle a form select with just css, i have seen how it can be done with jquery, i am putting a radius on

 

works ok in IE FF, but safari chrome are both default

#emailer select, #emailer input {

width: 260px;

height: 35px;

padding: 5px 20px 0px 20px;

margin: 0 0 20px 0;

background-color: #E6EEEA;

border-radius: 20px;

-moz-border-radius: 20px;

-webkit-border-radius: 20px;

font-family: arial; font-size: 16px;

color: #807987;

}

Edited October 28, 201213 yr by ELITE

I'm sure I've read about using -webkit-appearance for fixing issues with this

 

Have you got a link as I just tried your code in chrome seemed to work fine

Edited October 28, 201213 yr by mteam

For the most part it's not possible. Deep magic protects <select> as well as radio and checkbox inputs. An buttons, irritatingly enough, but mainly those form elements. Most people end up re-creating them with <div>s since they're completely stylable. To do that, most people use jQuery.

Thank you, i will use Jquery

For future reference, always put the official CSS version of a property after any vendor-prefixed versions:

 

-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;

 

Browsers always implement the last version of a property they recognise, so it makes sense to ensure that the last version the browser encounters is the official one.

 

Selects do accept border-radius, so what I think you're experiencing there is some sort of clash or bug that's only manifesting itself in Webkit.

For future reference, always put the official CSS version of a property after any vendor-prefixed versions:

 

of course thank you very much +1