Hola que tal estoy dandole diseño a un sistema de noticias pero cuando quiero alinear uno alado del otro solo achica las columnas y siguen estando uno debajo del otro como puedo solucionarlo para que aparezcan uno alado del otro?
<?php foreach ($posts as $posts): ?>
<section class="post">
<div class="container">
<!--Card-->
<div class=" card">
<!--Card image-->
<div class="view overlay hm-white-slight">
<div class="thumb">
<a href="single.php?id=<?php echo $posts ['id']; ?>">
<div style="padding: 40px; padding-top: 90px; background-size: cover; background-position: center; width: 100%; height: 400px; background-image: url('img/<?php echo $posts ['thumb']; ?>'); ">
</div>
</a>
</div>
</div>
<!--/.Card image-->
<!--Button-->
<a href="single.php?id=<?php echo $posts ['id']; ?>" class="btn-floating btn-action"><i class="fa fa-chevron-right"></i></a>
<!--Card content-->
<div class="card-block">
<!--Title-->
<h2 class=" titulopost h3-responsive card-title"><a href="single.php?id=<?php echo $posts ['id']; ?>"> <?php echo $posts ['titulo']; ?></a></h2><hr>
<!--Text-->
<p class="card-text"><?php echo $posts ['estracto']; ?></p>
</div>
<!--/.Card content-->
<!-- Card footer -->
<div class="card-data">
<ul>
<li><i class="fa fa-clock-o"></i> <?php echo $posts ['fecha']; ?></li>
</ul>
</div>
<!-- Card footer -->
</div>
<!--/.Card-->
</div>
</section>
<?php endforeach; ?>