Estoy trabajando con tarjeta de Bootstrap y php del cual obtengo mediante un query los datos que deberían mostrarse en cada una de las tarjetas, por lo que efectúo un while para agregar todas las tarjetas en una sola variables y posteriormente regresarlas, el código es el siguiente:
while ($resultados = $articles->fetch(PDO::FETCH_ASSOC)) {
$contenido .= '
<div class="card">
<img src="..." class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Titulo</h5>
<p class="card-text">Descripcion</p>
<p class="card-text">Costo</p>
<p class="card-text"><small class="text-muted">Status con Color</small></p>
</div>
</div>';
}
El problema que tengo radica en como se muestran ya que no llegan a un breakpoint, digamos que quiero mostrar máximo 4 tarjetas por renglón, pero el resultado es que a mayor numero de tarjetas mejor tamaño tiene estas ya que se empiezan a "apretar" dado que no las coloca en el siguiente párrafo. ¿Alguna idea de como solucionar esto?
El código donde están contenidas las tarjetas es:
<div class="col-sm-9">
<span class="subtitle">
<div class="container-fluid">
<div class="card-deck">
<?php echo ArticleController::GetProducts($category, $CurrentCategory->id); ?>
</div>
</div>
</span>
</div>
Lo anterior esta dentro de un div.class="row" y tiene un div lateral con la clase div.class="col-sm-3"