We are currently in the process of removing legacy CSS from MediaWiki. In many cases this will significantly reduce the amount of CSS needed to render a MediaWiki page which will lead to better page load times, however may impact articles in one particular way.
If your wiki uses `<div class="mw-content-ltr">` or `<div class="mw-content-rtl">` without dir or lang attributes, these will currently not work in the Vector modern skin and will soon stop working in future in other skins without action.
# Action required
## 1) Check the impact on your wiki.
Go to `yourwiki`/w/index.php?title=Special:Search&search=insource%3A%2F\<div+class\%3D["']mw-content-(ltr|rtl)["']\>%2F&profile=advanced&fulltext=1&ns0=1&ns1=1&ns2=1&ns3=1&ns4=1&ns5=1&ns6=1&ns7=1&ns8=1&ns9=1&ns10=1&ns11=1&ns12=1&ns13=1&ns14=1&ns15=1&ns100=1&ns101=1
Check the results in the top right corner. If the number is significant (I would suggest. < 1000 may not be significant for guidance), you are impacted.
Also check templates:
Go to `yourwiki`/w/index.php?search=insource%3A%2F%5C%3Cdiv+class%5C%3D%5B%22%27%5Dmw-content-%28ltr%7Crtl%29%5B%22%27%5D%5C%3E%2F&title=Special:Search&profile=advanced&fulltext=1&ns10=1
Check that no widely used templates appear in that search result.
## 2) Understand the issue
Click one of the search results to the above query and view in Vector modern by adding the following query string parameter:
?useskin=vector&useskinversion=2
Content will appear in the wrong writing direction.
|Broken| With correct fix |
|{F34569686}|{F34569688}|
## 3) Fix the issue
Add the following rule to MediaWiki:Common.css (or MediaWiki:(Monobook|Vector).css` if preferred.
```
/* Short term fix for T287701. Please remove when all templates have dir attributes */
.mw-content-ltr {
/* @noflip */
direction: ltr;
}
.mw-content-rtl {
/* @noflip */
direction: rtl;
}
```
## 4) Notify users that the dir attribute must be used going forward
.
Make sure editors are updated on best practices for including content in a different language / direction.
For example:
Correct:
```
<div class="mw-content-ltr" dir="ltr" lang="en">Today's featured article</div>
<div class="mw-content-rtl" dir="rtl" lang="he">ערך מומלץ </div>
```
Incorrect:
```
<div class="mw-content-ltr">Today's featured article</div>
<div class="mw-content-rtl">ערך מומלץ </div>
```