Page MenuHomePhabricator

SpecialPreferences: <p> should not be inside <strong>
Closed, ResolvedPublic

Description

/includes/specials/SpecialPreferences.php contains

$out->wrapWikiMsg(

"<div class=\"successbox\"><strong>\n$1\n</strong></div><div id=\"mw-pref-clear\"></div>",
'savedprefs'

);

and generates

<div class="successbox"><strong>
<p>Your preferences have been saved.
</p>
</strong></div>

The strong element http://www.w3.org/TR/html5/text-level-semantics.html#the-strong-element must contain phrasing content http://www.w3.org/TR/html5/content-models.html#phrasing-content. The p element is not allowed.

Solution: Remove strong and add
.successbox { font-weight: bold; }


Version: unspecified
Severity: trivial
URL: https://translatewiki.net/w/i.php?title=Special:Preferences&success=1

Details

Reference
bz33438

Event Timeline

bzimport raised the priority of this task from to Low.
bzimport set Reference to bz33438.
Fomafix created this task.Dec 30 2011, 9:22 PM

Or alternatively, parse with option 'inline' instead of default 'block', as is done for other inline messages.

The css class successbox is also used in some extensions. Some have the same problem <strong>\n$1\n</strong> or even use explicit <strong><p>.

The <div id="mw-pref-clear"></div> with #mw-pref-clear { clear: both; } is because successbox has a float:left.
mw-pref-clear is only defined in /skins/common/oldshared.css and /skins/modern/main.css by Bug 19759 in r53457 and r54197.

<div id="mw-pref-clear"></div> is not needed anymore because the following mw-prefs-form has already the css class visualClear:

https://translatewiki.net/w/i.php?title=Special:Preferences&success=1&useskin=cologneblue
https://translatewiki.net/w/i.php?title=Special:Preferences&success=1&useskin=standard
https://translatewiki.net/w/i.php?title=Special:Preferences&success=1&useskin=modern

.successbox { float:left } is a bad way to generate a box with intrinsic width. CSS has better possibilities.

Here is a example page with several boxes: https://translatewiki.net/w/docs/uidesign/design.html

successbox is not a inline message. It is always a block. The <strong> should be removed.

float:left is only there to generate a box with intrinsic width. This generates other problems like here: https://bugzilla.wikimedia.org/show_bug.cgi?id=28041#c7
The float:left should be removed. Then a lots of clear:both like #mw-pref-clear are unnecessary and can be removed. CSS has better possibilities to generate a box with intrinsic width.

(removing 38638 blocker, not related to i18n messages, but to how SpecialPreferences parses the output)

Change-Id: If606203218ece5974a956a3d41d5db40f55b2d5c

(In reply to comment #5)

Change-Id: If606203218ece5974a956a3d41d5db40f55b2d5c

Merged.

Thanks for fixing the <strong>.

There is still
float: left;
to generate a box with intrinsic width. But this needs a clear:left in the following element.

With the following definition instead there is no need for a clear:left:
display: inline-block;
zoom: 1;
*display: inline;

Related URL: https://gerrit.wikimedia.org/r/62439 (Gerrit Change Ibb9371eecb99b627ba9dfca5b0a60143fbd6f84f)

I submitted the above patch to apply this fix. (Keeping this bug closed since it's not really related - the original issue has been fixed.)

The fix for this changes the appearance of all forms using {error,success,warning}box, even those like Userlogin and Create account that weren't bolding their contents and don't wish to. I created bug 48197.

Related URL: https://gerrit.wikimedia.org/r/64517 (Gerrit Change I0b39138967f2d29d5e50db0a5990d175fcc81a8e)