title: Make full div clickable (html)
body: <p>I have the following problem!
  I have buttons (divs) with a text hyperlink inside it.
  I want this hyperlink to be clickable on whole the div. I got this to work by doing this</p>
  
  <p>HTML:</p>
  
  <pre><code>echo '&lt;div id="tagsul"&gt;&lt;a href="' . get_category_link( $category-&gt;term_id ) . '"       style="color:#FFF;" title="' . sprintf( __( "View all posts in %s" ), $category-&gt;name ) . '" ' . '&gt;' . $category-&gt;name.'&lt;/a&gt;&lt;/div&gt; ';
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>#tagsul{
  width:190px;
  height:40px;
  margin-right:5px;
  margin-left:5px;
  background:#82e1a1;
  text-align:center;
  float:left;
  margin-top:10px;
  }
  
  #tagsul a {
  display:block;
  height: 100%;
  width: 100%;
  text-decoration:none;
  }
  </code></pre>
  
  <p>This all works fine. But the text is now displayed at the middle top of the div. But I want it to be displayed in the middle of the div from both perspectives (height and width)</p>
  
  <p>I was thinking I could do something with a top padding but this doesnt work since the whole #tagsurl is clickable so when I use a padding at the top there will be a part under the button that is clickable too...</p>