Is it legal to wrap li in a?

Question

I struggle a bit to understand the documentation here: http://w3c.github.io/html-reference/terminology.html#transparent which is linked to from here: http://w3c.github.io/html-reference/a.html#a-changes

As far as I understand it the following code should be ok:

<!doctype html>
<head><title>Yo!</title>
<body>
    <ul>
        <a>
            <li>My list item is wrapped in an anchor.
        </a>
    </ul>

But when I paste this code in different validators, they all agree that the li element can not be wrapped in an a element like this. Am I reading the documentation wrong, or is all the validators I found outdated?

["Permitted parent elements ul, ol, menu"](https://www.w3.org/TR/html-markup/li.html) — PeeHaa, Aug 19 '16 at 12:54
If you are asking about that code running on browsers, some browsers allow HTML which is not valid according to the w3c specs. See related : http://stackoverflow.com/questions/25559999/why-arent-browsers-strict-about-html — DVJex, Aug 19 '16 at 13:01
The question is purely to understand if this is ok per the specs definitions. Because when reading the specs I understand that it is allowed, but that might be just because English is not my native language. — Drogos, Aug 19 '16 at 13:12

unor · Accepted Answer · 2016-08-19T16:04:43.323

First of all, you are not using a HTML specification. http://w3c.github.io/html-reference/ is just a "non-normative reference", and outdated (it’s a draft from 2012).

The HTML5 specification (which is currently the latest HTML W3C Recommendation) is https://www.w3.org/TR/2014/REC-html5-20141028/. HTML 5.1 is currently a Candidate Recommendation (it will likely be a W3C Recommendation soon).

The following links point to the HTML5 W3C Recommendation.

The content model of the a element is transparent. The content model explains what other elements the a element may contain. In the case of transparent, it means that the parent element’s content model will be used. But the content model says nothing about where the a element may appear.¹

The "contexts in which this element can be used"² lists where the element may appear. In the case of a, it’s:

Where phrasing content is expected.

So you can use a wherever you would also be allowed to use text, abbr, span etc. Note that the li element is not listed here (li is not phrasing content).

See the content model of the ul element: it only allows li and "script-supporting" elements (not a).

¹ Except for a elements nested in an a element, of course. But this is explicitly not allowed: "there must be no interactive content descendant".

² This listing is non-normative (only provided for convenience). You can see the normative contexts by checking each possible parent’s content model.

score -1 · Answer 2 · answered Aug 19 '16 at 13:25

-1

Legal Yes, noone will put you into jail for doing so. - Valid? No!

W3.org: li – list item

Permitted parent elements

ul, ol, menu

As stated in the comments some browsers will display invalid HTML, though validators will always warn you about your invalid code.

answered Aug 19 '16 at 13:25

AlexG

5,649
6
26
43

This is exactly why I at first also thought it was illegal. But then I noticed the the w3c spec I posted above, which I understand as the to be transparent and valid to put in between elements that a set of children, as long as the child of the transparent element follows the permitted child elements. Even I struggle to read what I just wrote there. Not sure how to phrase this correctly. – Drogos Aug 19 '16 at 13:50
You might understand the specs for `
` correctly but `

` are a different case, they have their own rules. It's like saying you're allowed to carry a gun in Texas, so you're allowed to carry one everywhere.
– AlexG Aug 19 '16 at 13:59

Is it legal to wrap li in a?

2 Answers2

Linked