User "Fomafix" posted a comment on MediaWiki.r92153.
Full URL: http://www.mediawiki.org/wiki/Special:Code/MediaWiki/92153#c19629
Commit summary:
r92054 : Remove leftover space
Comment:
The following actual category list wraps only between "Lorem" and "ipsum", but
not between "ipsum" and "Lorem" on Firefox 3.6.x:
<div style="background-color: #F9F9F9; border: 1px solid #AAAAAA; clear: both;
margin-top: 1em; padding: 5px;"><div>Categories: <ul style="display: inline;
list-style: none outside none; margin: 0;"><li style="padding: 0 0.7em 0 0.4em;
display: inline; list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li></ul></div></div>
Solution 1 <code>#catlinks li { display: inline-block; }</code>:
<div style="background-color: #F9F9F9; border: 1px solid #AAAAAA; clear: both;
margin-top: 1em; padding: 5px;"><div>Categories: <ul style="display: inline;
list-style: none outside none; margin: 0;"><li style="padding: 0 0.7em 0 0.4em;
display: inline-block; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display:
inline-block; list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline-block;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline-block;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline-block;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline-block;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline-block;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline-block;
list-style: none outside none; margin: 0;">Lorem ipsum</li></ul></div></div>
Solution 2 ''Zero-Width Space'' before <code><nowiki><li></nowiki></code>:
<div style="background-color: #F9F9F9; border: 1px solid #AAAAAA; clear: both;
margin-top: 1em; padding: 5px;"><div>Categories: <ul style="display: inline;
list-style: none outside none; margin: 0;"><li style="padding: 0 0.7em 0 0.4em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li></ul></div></div>
Solution 3 ''Zero-Width Space'' after <code><nowiki><li></nowiki></code>:
<div style="background-color: #F9F9F9; border: 1px solid #AAAAAA; clear: both;
margin-top: 1em; padding: 5px;"><div>Categories: <ul style="display: inline;
list-style: none outside none; margin: 0;"><li style="padding: 0 0.7em 0 0.4em;
display: inline; list-style: none outside none; margin: 0;">Lorem
ipsum</li><li style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display:
inline; list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li><li
style="border-left: 1px solid #AAAAAA; padding: 0 0.7em; display: inline;
list-style: none outside none; margin: 0;">Lorem ipsum</li></ul></div></div>
<code>#catlinks li:before { content: "\200b"; }</code> is equivalent to
solution 3.
_______________________________________________
MediaWiki-CodeReview mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-codereview
