title: a href inside div opening a new page/tab
body: <p>I have a div and I have a link inside this div.  I want the user to be able to click anywhere in the div and they go to the page that's in the link.  The link can be changed to a <code>&lt;span&gt;/&lt;p&gt;</code>, that's not important.  There are the following conditions, however:</p>
  
  <ol>
  <li>I cannot use css to make the <code>&lt;a&gt;</code> tags into <code>display: block;</code></li>
  <li>If I use onClick I want the user to be able to use the middle-mouse button (or right click, new tab) to open the page in a new tab if they so desire.  I currently do not have this functionality if I use onClick and javascript.  </li>
  <li>I want it to be valid CSS i.e. I don't want to have <code>&lt;a&gt;&lt;div&gt; .... &lt;/div&gt;&lt;/a&gt;</code></li>
  </ol>
  
  <p>That pretty much sums up the problem I have.  I've tried reading around but most people seem to solve the problem with either onclick, display: block or putting images, or forcing the user to open the page in a new window.  I do not want any of these solutions, I just want a div to work as a normal link (if possible).</p>
  
  <p>Many thanks</p>