Last Comment Bug 552251 - text-decoration should not underline images (imgs)
: text-decoration should not underline images (imgs)
Status: RESOLVED FIXED
: css2
Product: Core
Classification: Components
Component: Layout: Block and Inline (show other bugs)
: Trunk
: All All
: -- normal with 1 vote (vote)
: mozilla8
Assigned To: Nobody; OK to take it and work on it
:
Mentors:
Depends on: 403524
Blocks: css2.1-tests
  Show dependency treegraph
 
Reported: 2010-03-13 22:58 PST by kwutzke
Modified: 2011-08-06 10:08 PDT (History)
6 users (show)
See Also:
Crash Signature:
(edit)
QA Whiteboard:
Iteration: ---
Points: ---
Has Regression Range: ---
Has STR: ---


Attachments
Firefox rendering (4.21 KB, image/jpeg)
2010-03-13 23:08 PST, kwutzke
no flags Details
IE rendering (7.25 KB, image/jpeg)
2010-03-13 23:08 PST, kwutzke
no flags Details
HTML showing the described behavior (587 bytes, text/html)
2010-03-16 08:36 PDT, kwutzke
no flags Details

Description kwutzke 2010-03-13 22:58:33 PST
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:1.9.2) Gecko/20100115 Firefox/3.6 (.NET CLR 3.5.30729)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:1.9.2) Gecko/20100115 Firefox/3.6 (.NET CLR 3.5.30729)

Take any HTML with links, this examplary:

<a href="http://www.postgresql.org/docs/current/static/datatype-numeric.html">numeric types</a>

Associate the following CSS (the rule means "put a small 'link external' PNG after the link if it starts with 'http'"):

a[href^="http"]:after
{
    content: url(/images/link-external.png);
}

Now also define a general hover (or other) underline rule:

a:hover
{
    color: red;
    text-decoration: underline;
}

All external links will be rendered with the image being underlined, too, as well as the whitespace between the image and the text. This looks really ugly. Instead, only the text should be underlined. It should look like in IE 8...

Reproducible: Always

Steps to Reproduce:
1. see details
2.
3.
Actual Results:  
Underlined image + whitespace

Expected Results:  
Non-underlined image + whitespace

Not underline image + whitespace :-)
Comment 1 kwutzke 2010-03-13 23:08:05 PST
Created attachment 432391 [details]
Firefox rendering
Comment 2 kwutzke 2010-03-13 23:08:39 PST
Created attachment 432392 [details]
IE rendering
Comment 3 q0k 2010-03-13 23:35:04 PST
I've written some testing at http://pastebin.mozilla.org/708107, did not get the image underlined. Can you submit an HTML attachment please?
Comment 4 kwutzke 2010-03-14 04:59:30 PDT
Tried some hours, it seems to be doctype related. Any doctype I tried XHTML 1.1, XHTML 1.0 strict and trans, HTML 4.01 strict and trans cause the behavior. Omitting the doctype renders those links correctly.

I put the correction up into pastebin for you to see the underlined image. Hope this gets fixed soon.
Comment 5 kwutzke 2010-03-16 08:36:51 PDT
Created attachment 432823 [details]
HTML showing the described behavior
Comment 6 zug_treno 2010-03-18 06:39:25 PDT
Related to/duplicate of Core bug 280296?
Comment 7 David Baron :dbaron: ⌚️UTC+2 (mostly busy through August 4; review requests must explain patch) 2010-05-01 08:45:48 PDT
Slightly, but really it's a duplicate of the bug (or one of the sub-bugs :-) on rewriting text-decoration to follow the new CSS 2.1 rules, since those rules say images don't get underlined.
Comment 8 Vitor Menezes 2011-08-05 16:53:29 PDT
The patch for bug 403524 makes it so that text-decorations are drawn only on text in all modes.
Comment 9 kwutzke 2011-08-06 04:14:21 PDT
Which version of Firefox 3 will be the first one to show this fix?
Comment 10 David Baron :dbaron: ⌚️UTC+2 (mostly busy through August 4; review requests must explain patch) 2011-08-06 10:08:20 PDT
Firefox 8, most likely.  (Firefox 3.6.* receives security updates only.)

Note You need to log in before you can comment on or make changes to this bug.