Is an anchor in nested list invalid or is this a firebug error?

StackOverflow https://stackoverflow.com/questions/601754

  •  03-07-2019
  •  | 
  •  

Question

Is there something wrong with the following HTML, or am I simply experiencing a Firebug error? When I view the first list element in firebug, you'll see that firebug has difficulty correctly identifying the anchor; however, it has no problem with the second (outer) list element. If I remove the nested list from the first list element, then the problem disappears. Similarly, if I remove the outer list, the problem disappears. So, there appears to be a problem with placing an anchor around a nested list.

I've tried replacing the anchor with a div, and even a span, and firebug doesn't complain, so this seems to be anchor specific. I've also tried various doctypes, with no success.

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  </head>
  <body>
    <ul>
      <li>
        <a href="http://whatever" style="display:block">
          <p>some text</p>
          <ul>
            <li>a list entry</li>
          </ul>
        </a>
      </li>
      <li>
        <a href="http://whatever">
           <p>more text</p>
        </a>
       </li>
    </ul>
  </body>
</html>
Was it helpful?

Solution

The a element only allows inline-level elements as child elements. So the p element and ul element are not allowed there.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top