End tag “a” violates nesting rules.

The HTML specification explicitly forbids nesting <a> elements inside other <a> elements. This is defined as part of the content model for the <a> element — it is “transparent” but must not contain any interactive content, which includes other <a> elements. When the validator encounters a closing </a> tag that would violate these nesting rules, it raises this error.

This typically happens in one of two scenarios:

1. A missing closing </a> tag — You forget to close one link, so the next link appears to be nested inside it.
2. Intentionally wrapping one link inside another — You try to place a clickable link inside a larger clickable area, which is invalid HTML.

Why this matters

When an <a> element is nested inside another <a> element, browsers must guess what you intended. Different browsers may handle this differently — some will auto-close the first link before starting the second, while others may produce unexpected DOM structures. This leads to:

• Unpredictable behavior — Click targets may not work as expected across different browsers.
• Accessibility issues — Screen readers rely on a well-structured DOM. Ambiguous nesting confuses assistive technologies and makes navigation difficult for users who depend on them.
• Broken styling — CSS selectors that depend on proper parent-child relationships may not apply correctly.

How to fix it

1. Find the offending <a> tags — The validator will point to the line with the problematic closing </a>. Look at that line and the lines above it to find where the nesting issue begins.
2. Add missing closing tags — If you forgot a </a>, add it before the next <a> opens.
3. Restructure if needed — If you intended to have a link inside a larger clickable area, redesign the markup so that the links are siblings rather than nested.

Examples

❌ Missing closing tag causes implicit nesting

The first <a> is never closed, so the second <a> appears to be nested inside it:

<nav>
  <a href="one.html">Page 1
  <a href="two.html">Page 2</a>
</nav>

✅ Fixed by adding the missing closing tag

<nav>
  <a href="one.html">Page 1</a>
  <a href="two.html">Page 2</a>
</nav>

❌ Intentionally nesting links (invalid)

Wrapping a link inside a larger link is not allowed, even if it seems useful for UI purposes:

<a href="/article">
  <h2>Article Title</h2>
  <p>A short summary of the article.</p>
  <a href="/author">Author Name</a>
</a>

✅ Fixed by restructuring with sibling links

Use CSS positioning or a different layout strategy to achieve the same visual result without nesting:

<article>
  <a href="/article">
    <h2>Article Title</h2>
    <p>A short summary of the article.</p>
  </a>
  <p>By <a href="/author">Author Name</a></p>
</article>

❌ Forgetting to close links in a list

This is especially common in navigation menus built with lists:

<ul>
  <li><a href="/home">Home</li>
  <li><a href="/about">About</a></li>
  <li><a href="/contact">Contact</a></li>
</ul>

Here, the first <a> is never closed. The </li> tag implicitly closes the <li>, but the <a> remains open, causing nesting issues with the subsequent links.

✅ Fixed by properly closing each link

<ul>
  <li><a href="/home">Home</a></li>
  <li><a href="/about">About</a></li>
  <li><a href="/contact">Contact</a></li>
</ul>

A good habit is to write both the opening and closing <a> tags together before filling in the content. This prevents accidental omission and keeps your HTML well-structured.

Saiba mais:

MDN Reference

HTML anchor element

→

MDN Reference

HTML content models

→

WHATWG Spec

The a element - WHATWG HTML Standard

→