Page MenuHomePhabricator

Some RTL interfaces have incredibly large width, causing horizontal scrollbar to appear
Closed, ResolvedPublic

Description

Pages in non-Special namespaces in some wikis using the RTL interface (examples below) have a very large width, which makes a horizontal scrollbar to appear. This happens with many browsers (Chrome, Firefox, Safari, ...) and many OS's (Mac OS, Windows, ...).

Here are a few examples:

http://ar.wikipedia.org/wiki/نابليون_الأول
http://fa.wikipedia.org/wiki/ناپلئون_بناپارت
http://fa.wikibooks.org/wiki/آموزش_زبان_انگلیسی
http://mzn.wikipedia.org/wiki/تبرستون_علویون

I can see the same problem in other projects in following RTL langauges: fa, mzn, ar. I haven't been able to reproduce it in Hebrew wikis of Wikimedia. Given that multiple projects are affected, it looks like a MediaWiki-level CSS-related bug.


Version: wmf-deployment
Severity: major

Details

Reference
bz40609

Event Timeline

bzimport raised the priority of this task from to Needs Triage.Nov 22 2014, 12:48 AM
bzimport set Reference to bz40609.
bzimport added a subscriber: Unknown Object (MLST).

This is caused by the current siteNotice, who are using "left: -9999px;" which ALWAYS causes this kind of problem and NEVER should be used. It's not the first time this happens.

#B12_JimmyBlank {

position: absolute;
background-image: url(//upload.wikimedia.org/wikipedia/foundation/b/b5/Jimmy_ks_close.png);
background-repeat: no-repeat;
left: -9999px;
margin-bottom: 0.5em !important;
background-color:#FFFFFF;
border: solid 1px silver; 
height:172px;
overflow: hidden;
top: -9999px;

}

/* Bigger bold, blue text */
#B12_JimmyBlank #cn-bold-blue-text {

font-size: 2.25em;
font-weight: bold;
font-family: Helvetica, Arial, sans-serif;
color: navy;
padding: 1.5em 80px 0.8em 210px;
line-height: 1em;
text-align:center;

}

Until Chad Spencer responds, can someone with admin access in Meta please add these lines to that page:

body.rtl #{{{banner}}} {

left: 0;
top: 0;

}