'how inline element <a> contain block level elements here?

<a href="#">
      <h1>Our Plus Plan</h1>
      <h2>The most popular choice of our customers</h2>
      <p>
        Benefit from increased storage and faster support to ensure that
        your mission-critical data and applications are always available!
      </p>
    </a>

We know that, inline elements can't contain block element. But here is working fine. How is that possible here?

html


Solution 1:[1]

Well because I think html is not sensetive if there is a newline so whatever you put inside the tag, will turn into a link

Solution 2:[2]

The content model of the <a> element is defined as transparent, which means it can be either "flow content" or "phrasing content" depending on it's parent or ancestor. Those content models replaced the traditional separation between inline elements and block elements.

Regardless, browsers would not break the pagr even of you put something invalid like a <div> inside a </span>.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Aaseer
Solution 2 Noam

Related Questions