Bootstrap 4 card components as a button
<p>How do you make bootstrap 4 card as a button. Meaning that i click on any part in the card it some action gets called.</p>

<p>This code is from bootstrap 4</p>

<pre><code>&lt;div class="card-deck-wrapper"&gt;
  &lt;div class="card-deck"&gt;
    &lt;div class="card"&gt;
      &lt;img class="card-img-top" data-src="..." alt="Card image cap"&gt;
      &lt;div class="card-block"&gt;
        &lt;h4 class="card-title"&gt;Card title&lt;/h4&gt;
        &lt;p class="card-text"&gt;This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.&lt;/p&gt;
        &lt;p class="card-text"&gt;&lt;small class="text-muted"&gt;Last updated 3 mins ago&lt;/small&gt;&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="card"&gt;
      &lt;img class="card-img-top" data-src="..." alt="Card image cap"&gt;
      &lt;div class="card-block"&gt;
        &lt;h4 class="card-title"&gt;Card title&lt;/h4&gt;
        &lt;p class="card-text"&gt;This card has supporting text below as a natural lead-in to additional content.&lt;/p&gt;
        &lt;p class="card-text"&gt;&lt;small class="text-muted"&gt;Last updated 3 mins ago&lt;/small&gt;&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="card"&gt;
      &lt;img class="card-img-top" data-src="..." alt="Card image cap"&gt;
      &lt;div class="card-block"&gt;
        &lt;h4 class="card-title"&gt;Card title&lt;/h4&gt;
        &lt;p class="card-text"&gt;This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.&lt;/p&gt;
        &lt;p class="card-text"&gt;&lt;small class="text-muted"&gt;Last updated 3 mins ago&lt;/small&gt;&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>