Search code examples
htmlfigure

Can a figure tag contain an anchor tag wrapping the image?


I am trying to create a figure tag that has inside an anchor tag wrapping the image. I was wondering if that structure is legal or not. Here is the code showing how I want it to work.

<figure>
   <a href="/my-picture">
       <img src="img/picture.jpg" alt="My picture">
   </a>
   <figcaption>
       My picture
   </figcaption>
</figure>

Solution

  • Validator says it's proper structure, so yes.

    When it comes to semantic I don't see any problem, however always remember that in HTML5 you can wrap whole figure in a link which might be of use as in most of the case you want to wrap description also.

    I used this to validate:

    <!DOCTYPE html>
    <html>
      <head>
        <title>a</title>
      </head>
      <body>
        <figure>
          <a href="/my-picture">
            <img src="img/picture.jpg" alt="My picture">
          </a>
          <figcaption>
            My picture
          </figcaption>
        </figure>
      </body>
    </html>