css: dir="rtl" VS style="direction:rtl"
Use dir="auto" on forms and inserted text in order to automatically detect the direction of content supplied at run-time
<div dir="auto">Hello, world!</div>
<br/>
<div dir="auto">لا إله إلا الله محمد رسول الله</div>
<br/>
<input type="text" dir="auto" value="Hello, world!" >
<br/><br/>
<input type="text" dir="auto" value="لا إله إلا الله محمد رسول الله" >
JSFIDDLE Demo https://jsfiddle.net/80k0drsf/
As you can't modify the HTML, a really really hacky selector would be:
div[style*="direction:rtl"] {
...
}
JSFiddle demo.
Note that I'm using style*=
as opposed to just style=
as this will also match elements which have more than just direction:rtl
declared within the element's style
property.
For extra strength in the selector, you could also use [style*="direction: rtl"]
to handle style
attributes which separate the values from the properties with a space:
[style*="direction:rtl"], [style*="direction: rtl"] { ... }
Alternatively in this case you could just match on a style
attribute which contains "rtl", as I'm pretty sure this combination of characters isn't used in any other property (ignoring external resources like background image file names):
[style*="rtl"] { ... }
Updated JSFiddle demo.