less - CSS - Is there @media query for RTL languages -

less - CSS - Is there @media query for RTL languages -

i'm adding rtl (right left) languages back upwards big css (less) styles. i'm looking way add together nested rules in .less file it's possible resolution

with screen sizes can (having @small variable defined resolutions) , it's comfortable.

.my-class { width: 100px; @media @small { width : 50px; } }

is there way similar like

@media direction(rtl) { /** rtl styles goes here **/ }

it useful in .less files when add together nested styles differences rlt languages without creating separated styles.

the thing i've found :dir pseudo in css @ moment supported firefox. https://developer.mozilla.org/en-us/docs/web/css/:dir

i need ie9 + support.

no. directionality not property of medium, property of document , content.

instead, can utilize pseudo-class :dir(rtl), matches element has right left directionality set on it, straight or indirectly via inheritance. unfortunately, browser back upwards limited purposes (only firefox , chrome, , latter requires vendor prefix).

you might utilize attribute selectors [dir=rtl], matches elements have dir attribute explicitly set on them, not elements have right left direction because inherited parent. can combine other selectors.

to take simple example, suppose have dir attribute set on body (or html) element, differently on different pages, , wish utilize same style sheet pages things differently on different pages. can utilize e.g.

[dir=rtl] h1 { ... }

to set rules on h1 on right-to-left pages.

css less right-to-left