metin hizalama: sağ <seç> veya <seçenek>

Bir sağındaki hizalama metne mümkün olmadığını biliyor mu <select>veya daha spesifik <option>içinde eleman WebKit . Bunun, IE'yi içeren tarayıcılar arası bir çözüm olması gerekmez, ancak mümkünse saf CSS olmalıdır.

İkisini de denedim:

select { text-align: right }ve option { text-align: right }, ancak WebKit'te (Chrome, Safari veya Mobile Safari) çalışmadığı görülüyor.

Herhangi bir yardım minnetle alındı!

"Dir" özelliğini kullanmayı deneyebilirsiniz, ancak bunun istenen etkiyi yaratacağından emin değilim?

<select dir="rtl">
    <option>Foo</option>    
    <option>bar</option>
    <option>to the right</option>
</select>

Demo burada: http://jsfiddle.net/fparent/YSJU7/

Aşağıdaki CSS, hem oku hem de seçenekleri sağa hizalayacaktır:

select { text-align-last: right; }
option { direction: rtl; }

<!-- example usage -->
Choose one: <select>
  <option>The first option</option>
  <option>A second, fairly long option</option>
  <option>Last</option>
</select>

Benim için en iyi çözüm yapmaktı

select {
    direction: rtl;
}

ve sonra

option {
    direction: ltr;
}

tekrar. Dolayısıyla, bir ekran okuyucuda metnin nasıl okunduğunda bir değişiklik veya biçimlendirme sorunu yoktur.

Sanırım senin istediğin:

select {
  direction: rtl;
}

burada oynadı: http://jsfiddle.net/neilheinrich/XS3yQ/

Seçili yer tutucu değerini seçim kutusunun sağına hizalamam ve aynı zamanda seçenekleri sağa hizalamam gerektiği, ancak yönü kullandığımda aynı sorunla karşı karşıyaydım: rtl; Seçmek için bazı sağ dolguyu seçmek ve uygulamak, ardından tüm seçenekler de yalnızca seçili yer tutucuya dolgu uygulamak istediğim için dolgu ile sağa kayıyor.

Sorunu aşağıdaki stille düzelttim:

select:first-child{
  text-indent: 24%;
  direction: rtl;
  padding-right: 7px;
}

select option{
  direction: rtl;
}

Metin girintisini ihtiyacınıza göre değiştirebilirsiniz. Umarım size yardımcı olur.