144139 - CSS "A" styles and pseudo classes are applied to target anchors

Status: VERIFIED INVALID

(Core :: CSS Parsing and Computation, defect)

Description

[GAThrawn]

Using Moz 1.0 RC2 (2002051006, Win 2000 Pro) I have noticed that text that has
"target anchor" tags around it inherits the "a" tag's CSS styles and also the
"a" tag's pseudo class's styles as well (eg :hover). This seems to happen in
both "quirks" and "standards compliance" rendering modes.

If you create a page that specifies a style on the "a:hover" property, and then
in the page itself use target anchors using <a name="foo"> (or even <a
id="foo">), so that you can link to that particular section of the document,
then any text surrounded by the <a name="foo"> tag will have all of the "A"
tag's styles and pseudo class styles applied to it causing the user to
mistakenly believe that this is a clickable link.

This has never previously happened in previous milestone versions of Mozilla
(1.0 RC1 definitely doesn't and I can't remember any previous version doing so
either) so this seems to be a recent regression (possibly related to the fixes
for bug 5693 mentioned in RC2's release notes but I couldn't see any mentions of
this behaviour on that bug or it's dependencies). Also none of the other major
browsers seem to apply the "A" tag's styles to named target anchors (eg Internet
Explorer, NS4 and Opera all behave as expected).

Both CSS1 and CSS2 specify that only "a" elements with an "href" should be put
into the link pseudo class groups and CSS1 specifically states that target
anchors are excluded and should not have these styles applied.

CSS1:
"All 'A' elements with an 'HREF' attribute will be put into one and only one of
these groups (i.e. target anchors are not affected)."
(from http://www.w3.org/TR/REC-CSS1#anchor-pseudo-classes )

CSS2:
"The document language determines which elements are hyperlink source anchors.
For example, in HTML 4.0, the link pseudo-classes apply to A elements with an
"href" attribute."
(from http://www.w3.org/TR/REC-CSS2/selector.html#link-pseudo-classes )

I will attach a test case in a moment.

Comment 1

[GAThrawn]

Attachment: Testcase

Testcase showing both <a href=".."> links and <a name=".."> target anchors
having :hover pseudo class applied to them.

Comment 2

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

This is not a bug.  The "a" selector matches any "a" element, and :hover applies
to all elements (it's a dynamic pseudo-class, not a link pseudo-class -- see 
http://www.w3.org/TR/REC-CSS2/selector.html#q15

For a description of how to suggest styles for links, see:
http://www.people.fas.harvard.edu/~dbaron/css/1999/09/links

Comment 3

[Hixie (not reading bugmail)]

The reporter is correct -- :link only matches <a> elements that have an 'href'
attribute... but if you don't mention :link, then that isn't really relevant. :-)

See http://www.people.fas.harvard.edu/~dbaron/css/1999/09/links

Comment 4

[GAThrawn]

OK rereading the standards to the letter I realise the error of my ways :-)

It was a just a bit of a shock seeing something that works in all the other
mainstream browsers and had previously worked in Mozilla suddenly work unexpectedly.

I've also just done a quick search on some HTML tutorial sites on the web and a
number of them teach this the wrong way, the way that now breaks in Mozilla.
Might be worth some evangelism, I guess.