Inline cards
by stot
HTML
<div id="container">
<div class="card">a</div>
<div class="card">a</div>
<div class="card">a</div>
<div class="card">a</div>
<div class="card">a</div>
<div class="card">a fkdlsöajf slöfjd sjklaöfjd jfklsöj fkdlsö fjkdslö kfldsj </div>
<div class="card"><div>b<br></div></div>
<div class="card">a</div>
<div class="card">a</div>
<div class="card">a</div>
<div class="card">a</div>
<div class="card">a</div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
<div class="dummy"></div>
</div>
CSS
#container {
text-align: justify;
border: 10px solid black;
min-width:125px;
}
#container .card {
width: 125px;
height: 125px;
display: inline-block;
background: red;
white-space: nowrap;
overflow:hidden;
}
#container .dummy {
width: 125px;
display: inline-block;
}