Creating Valid XHTML Clickable Block Region

Question

I'm trying to make a "clickable" region.

<a
  style="display: block"
  href="http://stackoverflow.com">
  StackOverflow
</a>

A is an inline element but the CSS made it a block.

If the above is valid, then the following should be valid too:

<a
  style="display: block"
  href="http://stackoverflow.com">
  <div>Some DIV that links to StackOverflow</div>
</a>

But validator.w3.org shouldn't be flagging it as invalid (which it is right now).

If it is invalid, what would be the most proper way to make a block element "clickable" and redirects to an arbitrary page. I'm aware I can use JS onclick to achieve this behaviour, but how will Google see this?

Answer 1

The validator is correct - you can't put <div> inside <a>, no matter what you do afterwards with CSS.

The proper thing to do is what you did in your first code block - <a style="display: block;">

If you want something inside that you can do <a style="display: block;"><span style="display: block;">