You may already be aware of the following, but because I keep seeing this error in the files (probably some leftovers from a designer who is no longer working with us) I want to take a minute to bring this to everyone’s attention:
When you use attributes, such as “padding-left” and “margin-right”, in a .css file, you have to pay attention to these attributes when writing the overrides in the -rtl.css file. Here’s an example:
If you have the following in the style.css file:
margin-left: 10px; /* LTR */
The corresponding RTL file, styles-rtl.css, will look like this:
margin-left: 0; /* RTL*/
margin-right: 10px; /* RTL*/
If you don’t reset the left margin, there may be unwanted behavior in the RTL website. And, obviously, the same is true for any direction-related attribute: margin, padding, position, etc.
This is why, personally, when possible, I prefer using the full attribute syntax:
margin: 0 0 0 10px;
This syntax is easily converted to “margin: 0 10px 0 0;” in the RTL css file.