Open Bug 932743 Opened 11 years ago Updated 2 years ago

strikethrough is rendered wrongly when big font size is used, superscript element etc.

Categories

(Core :: Layout: Text and Fonts, defect, P5)

25 Branch
x86_64
Linux
defect

Tracking

()

UNCONFIRMED

People

(Reporter: w.walc, Unassigned)

References

Details

(Keywords: testcase, Whiteboard: [bugday-20131030])

Attachments

(2 files)

Attached file s.html
User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.76 Safari/537.36

Steps to reproduce:

One of our customers reported that strike element "is rendered wrongly" in Firefox.
It was reported for CKEditor: http://ckeditor.com/ but *has nothing to do with the editor or contenteditable at all*.

I tried three different HTML snippets (see the attached file) and compared the results in different browsers. They seemed to look quite consistent in IE/Chrome/Opera, while in Firefox they look totally different.

This looks similar to (especially with comments added by Aryeh Gregor): 
https://bugzilla.mozilla.org/show_bug.cgi?id=778796
but can be reproduced using a plain HTML file.



Actual results:

Behaviour in Firefox:

1)

<p><s><span style="font-size:48px">E=mc<sup>2</sup></span></s></p>

Strikethrough looks almost like an underline for the whole formula

2) 

<p><span style="font-size:48px"><s>E=mc<sup>2</sup></s></span></p>

Strikethrough is rendered almost properly, but it still just underlines the <sup> element.

3)

<p><s>foo<span style="font-size:48px">bar</span>baz</s></p>

Strikethrough for "bar" looks almost like an underline


Expected results:

Behaviour in IE/Chrome/Opera:

1, 2, 3)

<p><s><span style="font-size:48px">E=mc<sup>2</sup></span></s></p>

<p><span style="font-size:48px"><s>E=mc<sup>2</sup></s></span></p>

<p><s>foo<span style="font-size:48px">bar</span>baz</s></p>

Strikethrough always strikes each element in the middle of it.
Component: Untriaged → Layout: Text
Product: Firefox → Core
See Also: → 778796
Whiteboard: [bugday-20131030]
I'm not sure the Firefox result is wrong in all cases here... rather, I think the markup is poorly structured for the intended result. In particular, note that for an example such as:

  data:text/html,<div><u>1<sup>st</sup></u></div><div>1<sup><u>st</u></sup></div>

the rendering in Firefox is *correct* according to http://dev.w3.org/csswg/css-text-decor-3/#line-decoration (see Figure 7 there), while Chrome is incorrectly moving the underline along with the superscripted "st" in the first line.

(To see why the Firefox behavior, as per the text-decoration spec, makes sense (at least some of the time!), try comparing an example like:

  data:text/html,<div><u>October 31<sup>st</sup>, 2013</u></div>

where Chrome's broken underline looks quite bad, IMO.)

If you want the strikethrough to "follow" the vertical positioning and font size of the various elements, it should be applied *within* each of those elements individually. A strikethrough applied "outside" them is treated uniformly across the whole of the (ancestor) element to which it applies.
Attached file testcase
The rendering of "testcase" in Nightly on Linux64 looks correct to me.
Keywords: testcase
Priority: -- → P5
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: