I would like to know how to define number of cards per row. I want to have 2 cards in a row in medium screen size but in every change I have still 4.
It's whole bootstrap.
<div class="container-fluid">
<div class="card-deck">
<div class="card col-md-6">
<img class="card-img-top" src="img/historia_kľačno.jpg" alt="História Kľačna">
<div class="card-body">
<h5 class="card-title">História Kľačna</h5>
<p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</div>
</div>
<div class="card col-md-6">
<img class="card-img-top" src="img//zelena_ruža.jpg" alt="">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</div>
</div>
<div class="card col-md-6">
<img class="card-img-top" src="img/hlineny_dom.jpg" alt="Hlinený dom">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">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.</p>
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</div>
</div>
<div class="card col-md-6">
<img class="card-img-top" src="img/rusko.jpg" alt="Potravinová nezávislosť">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">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.</p>
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</div>
</div>