Is there a way to align the divs inside container 3 in a row?
<div class="container">
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
</div>
Flexbox is come to solve that one. another (old) approach is to use display: inline-block (instead of float.)
.product {
display: inline-block;
width: 30%;
height: 50px;
border: 1px solid green;
}<div class="container">
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
<div class="product"></div>
</div>Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments