Text-indent is not working in safari firefox

Question

Hi All,

I m using a ruby code in select list i need 15px gap from left so i used a padding left="15px" its working fine in firefox but its not working ie and safari so i want to use text-indent ="15px" its working fine i safari and ie but not in firefox please any one help me to resolve this problem,, padding left is working fine in textfeild but why it giving problem in ie and safari ...

Code:

 <% @sex = [['male', '0'],['female', '1'], ['other', '2']] %> 
              <%= select_tag :sex, options_for_select(@sex), :style=>"width:100px; height:30px;padding-left:15px;vertical-align:middle;" %>

Thanks

Answer 1

select elements are very difficult to style consistently cross-browser, and even worse cross-platform (they're very different-looking things on Windows and MacOS X for instance).

However, assuming the document is in standards mode, I've been able to get a consistent result across IE8, Chrome and Firefox on Windows using this code:

select { padding-left: 15px; }

IE7 falls back to the default styling (i.e. no padding), if you can live with that.

Another option might be to wrap the <select> in another element (e.g. a <span>) and apply some styling to that. That would indent the entire element, rather than it's contents though.