I've had a bit of a search around and have found the thread regarding the W3c standards on not using inline elements (e.g. <a>) around block elements (e.g. <h2>, <p>) but it doesn't explain how one can get round the problem of not being 'allowed' to use a block element as a link.
I have the following HTML code:
Code:
<div id="how">
<a href="how.html">
<h2>Heading</h2>
<p>content</p>
</a>
</div>
with the following css to style the 'box' created.
Code:
#how {
width: 750px;
border: 8px double blue;
margin: 10px auto;
padding-bottom: 10px;
}
#how p {
padding: 0 10px;
line-height: 1.2em;
}
This won't validate due to the <h2> and <p> tags being inside the <a> tag.

Any thoughts as to how I can 'legally' achieve using the whole box as a link?

A thought strikes me - should I be looking at the <button> tag?