XHTML: Placing DIVs in A tags

Question

Hello!

Is it alright to place div tags inside anchor tags? Will contents of the div redirect the page to the href of the anchor tag?

Thank you.

Answer 1

No that is certainly invalid HTML.

-Will contents of the div redirect the page to the href of the anchor tag? I'm not so sure on what you mean on this one. But its not the contents of a div that an anchor follows but the anchor's href attribute.

Answer 2

Is it alright to place div tags inside anchor tags?

Yes, if:

1. You are using HTML5/XHTML5; and
2. The anchor tag is not in an inline context. i.e. a descendant of an element that only allows phrasing content.

Otherwise no.

In HTML5/XHTML5 the <a> element in not simply an inline element as it is in HTML4/XHTML1. Instead it has a transparent content model, which means that the validation rules are the same as if it wasn't there.

So for example

<div>
   <div>Hello World</div>
</div>

is valid, so

<div>
   <a href="#">
      <div>Hello World</div>
   </a>
</div>

is too.

But

<p>
   <div>Hello World</div>
</p>

is not valid, so

<p>
   <a href="#">
      <div>Hello World</div>
   </a>
</p>

isn't either.

Answer 3

If what you're trying to achieve is a block-level link, you can simply use CSS:

a.block {
    display: block;
    /* everything else */
}

<a class="block">...</a>