title: Make entire <div> inside <a> clickable
body: <p>I'm trying to make the entire content inside the <code>&lt;a&gt;</code> tag clickable but only the text is right now. </p>
  
  <p>Here a CodePen: <a href="http://codepen.io/francobermudez/pen/dvBpNw?editors=1100" rel="nofollow noreferrer">http://codepen.io/francobermudez/pen/dvBpNw?editors=1100</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;section id="ultimos-eventos"&gt;
      &lt;div class="eventos-wrap"&gt;
  
          &lt;a href="#"&gt;
              &lt;div class="evento"&gt;
                  &lt;div class="evento-fecha"&gt;
                      &lt;div class="evento-dia"&gt;20&lt;/div&gt;
                      &lt;div class="evento-mes"&gt;MAR&lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="evento-info"&gt;
                      &lt;div class="evento-titulo"&gt;This is my title&lt;/div&gt;
                      &lt;div class="evento-subtitulo"&gt;
                          &lt;div class="evento-direccion"&gt;&lt;div&gt;&lt;/div&gt;This is my subtitle&lt;/div&gt;
                          &lt;a class="btn-evento btn-azul" href="#"&gt;Detalles&lt;/a&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/a&gt;
  
      &lt;/div&gt;
  &lt;/section&gt;
  </code></pre>