Safari browser: set the <option> text alignment in the <select> tag

Question

How to set the correct text direction for a selection option checkbox?

<select style="direction:rtl;text-align:right"> <option value="" selected="">همه</option> <option value="1">راهبر سيستم</option> <option value="0">عادی</option> </select> 

jsfiddle: http://jsfiddle.net/CHg8v/

The solutions to the duplicate question do not cover my problem:

text-align: right on <select> or <option>

UPDATE: I am using Safari 5.1 on Windows.

text-align:-webkit-right does not work in Safari 5.1 for Windows

Answer 1

Safari has a problem (error) with the <Select> option for text-align:right with the direction:rtl . Please check the following link for bug report: -

-> https://bugs.webkit.org/show_bug.cgi?format=multiple&id=19785

In addition, I also find so many forums that reported this issue to check out some of them: -

-> http://csscreator.com/node/32981

-> http://css-tricks.com/forums/topic/aligning-select-box-options-to-the-right-in-safari/

-> http://hintsforums.macworld.com/showthread.php?t=107502

You can do google for more information about this error,

On safari road maps (Implementations), I have not heard any solutions for this error / problem.

Answer 2

use this: .classNameOfYourSelect input [type = option] {style that you want to add here}. This way you only edit Option elements with a specific css that you will write inside the brackets, for example color, background color, and whatever you want.

Answer 3

try this text-align:-webkit-right