Page MenuHomePhabricator

table headers in Firefox&Chrome get left aligned when you enable "Justify paragraphs"
Closed, DeclinedPublic

Description

On Firefox the table headers (th) gets left aligned when you enable "Justify paragraphs" in [[Special:Preferences#mw-prefsection-rendering]] or use text-align:justify for a container. On Internet Explorer the table headers keep centered.

Expected result: The table headers should always be centered.

I think this is a bug in Firefox. The table caption (caption) is in Firefox always centered as expected.

With the following CSS definition in skins/common/commonElements.css the table headers are centered by default:

th {
text-align: center;
}

Test case:

<div style="width: 20em; float:left; margin-right:1em; border: 1px dashed silver;">
This paragraph is '''without''' <code>text-align:justify</code>.

{|

+ Long caption of the table
-

! th cell !! th cell with<br />two lines

-
td 1td 2
-
width td cellth cell with<br />two lines
}

</div>
<div style="text-align: justify; width: 20em; float:left; margin-right:1em; border: 1px dashed silver;">
This paragraph is '''with''' <code>text-align:justify</code>.

{|

+ Long caption of the table
-

! th cell !! th cell with<br />two lines

-
td 1td 2
-
width td cellth cell with<br />two lines
}

</div>
<div style="clear:left"/>


Version: unspecified
Severity: normal
URL: https://de.wikipedia.org/w/index.php?title=Benutzer_Diskussion:PsY.cHo&oldid=102407876#th_align.3D.22center.22

Details

Reference
bz36231

Event Timeline

bzimport raised the priority of this task from to Low.Nov 22 2014, 12:23 AM
bzimport set Reference to bz36231.
bzimport added a subscriber: Unknown Object (MLST).

sumanah wrote:

Thanks for the suggestion! https://www.mediawiki.org/wiki/Git/Tutorial helps you see how to submit that as a patch so our developers can easily review it and, if accepted, merge it into our source control system. Would you be interested in doing that?

Also, does the problem still happen with current versions of Firefox & MediaWiki?

(In reply to comment #1)

Also, does the problem still happen with current versions of Firefox &
MediaWiki?

The problem still exists in Firefox 14.0.1 and in current version of MediaWiki. See testcase.

With the additional definition th { text-align: center; } the alignment for table header cells in tables with text-align on table rows doesn't work anymore:

{|

- style="text-align: right;"

! Head 1 !! Head 2

-
Table body cell 1Table body cell 2
}

Without th { text-align: center; } the two table head cells get right aligned.
With th { text-align: center; } the two table head cells get centered.

wikitable has already this behavior:

{| class="wikitable" style="text-align: right;"

-

! Head

-
1
-
12
-
123
-
1234
-
12345
-
123456
-
1234567
}

The table header cell is centered and the table body cells are right aligned.

When the definition

th { text-align: center; }

in skins/common/commonElements.css gets added, the definition

text-align: center;

for

table.wikitable > tr > th,
table.wikitable > * > tr > th

in skins/common/shared.css and in skins/common/commonPrint.css can be omitted.

rahul14m93 wrote:

Gerrit Change #55517

massaf wrote:

Apologies if this sounds silly because it's a simple design change, but would you mind posting before/after screenshots of the fix?

Is it still happening in recent Firefox versions?

(In reply to comment #6)

Is it still happening in recent Firefox versions?

Yes. With activated justify on actual Firefox and Chrome the th gets left-aligned, On Internet Explorer 8 and Opera the th gets centered.

technical fix only (browser compatiblity), removed design tag

Patch in Gerrit needs rework.
Unassigning from Rahul for the time being as there has not been any follow-up in Gerrit, but feel free to assign it again to you if you plan to work on this.

The preference was just recently removed (bug 52810), I guess that makes this a WONTFIX.

Change 55517 abandoned by Bartosz Dziewoński:
(Bug 36231) Fixed the issue of table headers getting left aligned on enabling "Justify Paragraphs"

Reason:
See bug.

https://gerrit.wikimedia.org/r/55517