365970 - Underline/overline don't appear on child elements with background-color set

Status: RESOLVED WORKSFORME

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

Description

[Aryeh Gregor (:ayg) (no longer with Mozilla)]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1

I first observed this bug on Wikipedia, where <code> has a gray background and I was trying to use it in links, but it wasn't being underlined.  After some poking, I came up with a minimal test case, attached.

I'm classifying as a minor bug due to minor effects and easy workaround: the bug is in inheritance, not rendering, so you can just add some extra style rules.

Reproducible: Always

Steps to Reproduce:
View attachment in an affected version of Firefox.  In the string "Works doesn't does", "Works " has no background-color specified, "doesn't" has a background-color and inherits the text-decoration property, and " does" has a background-color but has its own text-decoration property declared.
Actual Results:  
The text "Works doesn't does" appears fully struck through and blinking, but only "Works " and " does" are underlined and overlined.  

Expected Results:  
The entire text should be struck through, blinking, underlined, and overlined.

Comment 1

[Aryeh Gregor (:ayg) (no longer with Mozilla)]

Attachment: HTML file illustrating the bug

Comment 2

[Martijn Wargers (dead)]

Attachment: testcase2

Well, the text-decoration property isn't inherited, see:
http://www.w3.org/TR/CSS21/text.html#lining-striking-props
And since you are adding a background-color (the testcase I added makes it clear a background-color is set), the underline and overline disappear. The line-through and blink should also disappear, so in fact, that seems to be a bug.

In quirks mode, the underline overline line-through and blink all work, that's probably some compatibility adjustment.

Comment 3

[Aryeh Gregor (:ayg) (no longer with Mozilla)]

I see.  That's . . . a valid interpretation of the standard, I suppose, but it strikes me as unexpected.  It is also not the one IE or Opera use, and I would be pretty surprised if the standards authors intended it.  Is there some kind of process for review or wider discussion of Mozilla interpretations of standards?  Perhaps the authors of the original standard, or the current authors of the CSS3 Text module, could be consulted?

Comment 4

[philippe (part-time)]

(In reply to comment #2)
> Well, the text-decoration property isn't inherited, see:
> http://www.w3.org/TR/CSS21/text.html#lining-striking-props
> And since you are adding a background-color (the testcase I added makes it
> clear a background-color is set), the underline and overline disappear. The
> line-through and blink should also disappear, so in fact, that seems to be a
> bug.
The property is not inherited, but it applies to the whole outer span. The fact that blink still works for the inner (green) span is not a bug; I'm not sure about line-through though.

Reading http://www.w3.org/TR/CSS21/zindex.html#q2, particularly point 7.2.1, it is a bit unclear if the background of the inner span (green) should or not be on top of the text decoration of the outer span.

Opera paints the text-decoration on top, Webkit paints the green background on top (the same way as Gecko).

Comment 5

[Aryeh Gregor (:ayg) (no longer with Mozilla)]

Interesting link, I had never read that part of the spec.  It seems to me, however, that the background color is 7.2.1.1, while text decoration (other than blinking) is 7.2.1.4.1.1 (!).  It explicitly states that in that step you're supposed to draw *all* applicable text decorations, in tree order.  Am I misreading it?  I would be inclined to say Opera and IE have it right.

(Incidentally, CSS neophyte that I am, I only just realized that adding an extra rule to handle the element with a background color doesn't work, because for different fonts the line might be drawn higher/lower/thicker/thinner/etc.  That means no easy workaround, so minor -> normal.)

Comment 6

[Aryeh Gregor (:ayg) (no longer with Mozilla)]

Ms2ger points out that this now works in mozilla-central.  He suggested I resolve WORKSFORME with in-testsuite:?.

Comment 7

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

Yeah, presumably fixed by bug 403524.