Can you please provide a minimal testcase?

Sure, see http://de.wikipedia.org/wiki/Benutzer:Patrick87/lineheight for some basic testcase which compares normal text, text with sub/superscripts and text with sub/superscripts with my CSS suggestion applied.

Change 121419 had a related patch set uploaded by Kaldari:
Follow-up to typography changes to Vector

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

Change 121419 merged by Swalling:
Follow-up to typography changes to Vector

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

swalling wrote:

Should be fixed now. Will roll in to prod soon.

This is *not* fixed by "line-height:1" as apparent from the testcase I supplied initially.

It would be fixed by "line-height:0" though as was used in the initial patch set linked.

[1] https://de.wikipedia.org/wiki/Benutzer:Patrick87/lineheight

line-height: 1 fixes it for me. Could you provide your browser details and a screenshot?

Screenshot of testcase in Firefox 28.0 on Windows 7

Attached:

Screenshot of testcase in Internet Explorer 11 on Windows 7

Attached:

Change 121554 had a related patch set uploaded by Mwalker:
Follow-up to typography changes to Vector

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

Change 121554 merged by Mwalker:
Follow-up to typography changes to Vector

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

Eduard Braun: How does it look if you change the line-height of the <p> tags to "1.6" instead of "1.5em" (as we are eventually planning to do)?

If I change line height and/or try vector beta it's lees noticeable for <sup>s (although still not solved) whereas the problem persists for <sub>s.

It's also not truly avoidable. The browser gives space where needed. In the example it is needed. The reason why it is needed ? Well that is the note "Possible (but unlikely) issue".

Try that and then nest the sup/subs a couple of times, play with your browser zoom levels and the chance for overlaps become more and more likely.

I expanded the test case part about "Possible issue with overlapping sub/superscripts on following lines".

The difference between line-height:0, line-height:1 and line-height:1em is unnoticeable for me on Opera 21 and IE 11 on Windows 7, and very minor on Opera 12 (where the line-height is for some reason larger to prevent the overlap in the special case). (I'll upload screenshots in a second.)

Given the above, and given that line-height:0 apparently causes some problems on old IE (https://en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_4#Space_between_paragraphs_please_.28References.29), I suggest keeping line-height:1 and closing this bug. Thoughts?

Created attachment 14972
Opera 21 Next on Windows 7

Attached:

Created attachment 14973
IE 11 on Windows 7

Attached:

Created attachment 14974
Opera 12 on Windows 7

Attached:

Change 121953 had a related patch set uploaded by Bartosz Dziewoński:
commonElements: Move sup, sub styling from Vector's CSS to common styles

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

Change 121953 merged by TheDJ:
commonElements: Move sup, sub styling from Vector's CSS to common styles

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

As it seems where not really able to fix this issue only by adjusting the line-height of the subs/sups since especially Firefox uses different positioning:

What if we take a completely different approach and set the position of subs and sups manually? This way we could potentially synchronize the positioning across browsers and therfore produce a pleasing display on all systems.

Similar to [1] I tested the following CSS in IE 11 and FF 28 and it seems to work really nicely:

sup, sub {

vertical-align: baseline;
position: relative;

}
sup { top: -0.6em; }
sub { top: 0.4em; }

Would this be a reasonable approach?

[1] http://css-tricks.com/snippets/css/prevent-superscripts-and-subscripts-from-affecting-line-height/

(In reply to Gerrit Notification Bot from comment #20)

Change 121953 merged by TheDJ:
commonElements: Move sup, sub styling from Vector's CSS to common styles

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

This rule should be moved further from commonElements.css to shared.css so that *all* skins will get the fix (commonElements.css is not loaded in Modern and CologneBlue).

(In reply to Eduard Braun from comment #21)

As it seems where not really able to fix this issue only by adjusting the
line-height of the subs/sups since especially Firefox uses different
positioning:

<snip>

Honestly I think that what we have right now is the best solution to this; the real line height with sub/superscripts is only different from real line height of regular lines when it's necessary to prevent overlaps.

(In reply to entlinkt from comment #22)

This rule should be moved further from commonElements.css to shared.css so
that *all* skins will get the fix (commonElements.css is not loaded in
Modern and CologneBlue).

Ugh, right, it looks like this should have been done this way.

Change 123677 had a related patch set uploaded by Bartosz Dziewoński:
shared.css: Move sup, sub styling from commonElements to shared styles

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

Change 123677 merged by TheDJ:
shared.css: Move sup, sub styling from commonElements to shared styles

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

I'm going to tentatively close this bug.

If anybody still feels this can be done better, feel free to submit patches
– but with *lots* of before-and-after screenshots, especially on problematic browsers. :)