Usage Guide

Your guide on how to use and make the most out of RTLCSS

Value Directives

Value directives are placed any where inside the declaration value. They target the containing declaration node.

NameSyntaxDescription
Append /*rtl:append:{value}*/Appends {value} to the end of the declaration value.
Ignore /*rtl:ignore*/Ignores processing of this declaration.
Insert /*rtl:insert:{value}*/Inserts {value} to where the directive is located inside the declaration value.
Prepend/*rtl:prepend:{value}*/Prepends {value} to the begining of the declaration value.
Replace/*rtl:{value}*/Replaces the declaration value with {value}.

§Append

SyntaxDescription
/*rtl:append:{value}*/Appends {value} to the end of the declaration value.

§Example

.sample {
transform:rotate(45deg) /*rtl:append:scaleX(-1)*/;
}

§Ignore

SyntaxDescription
/*rtl:ignore*/Ignores processing of this declaration.

§Example

.code {
direction:ltr/*rtl:ignore*/;
}

§Insert

SyntaxDescription
/*rtl:insert:{value}*/Inserts {value} to where the directive is located inside the declaration value.

§Prepend

SyntaxDescription
/*rtl:prepend:{value}*/Prepends {value} to the begining of the declaration value.

§Example

.example {
font-family:"Droid Sans", "Helvetica Neue", Arial/*rtl:prepend:"Droid Arabic Kufi", */;
}

§Replace

SyntaxDescription
/*rtl:{value}*/Replaces the declaration value with {value}.

§Example

.example {
font-size:16px/*rtl:14px*/;
}

PREVNEXT