ff- chrome space-around bug
ff- chrome space-around different when single column/row
HTML
<div style="width:600px; height:100px">
<div id="dtlist">
<div class="b1 " style="width: 37%;">
<div class="flex-cont "
style="height: 200px;">
<div class="nkgs flex-item"> 22,50 </div>
<div class="nkgs flex-item"> 12,60 </div>
<div class="nkgs flex-item"> 22,85 </div>
<div class="nkgs flex-item"> 12,50 </div>
<div class="nkgs flex-item"> 22,50 </div>
<div class="nkgs flex-item"> 23,50 </div>
<div class="nkgs flex-item"> 26,90 </div>
<div class="nkgs flex-item"> 23,50 </div>
<div class="nkgs flex-item"> 12,50 </div>
<div class="nkgs flex-item"> 22,50 </div>
<div class="nkgs flex-item"> 225,00 </div>
<div class="nkgs flex-item"> 12,50 </div>
<div class="nkgs flex-item"> 23,50 </div>
<div class="nkgs flex-item"> 12,60 </div>
</div>
</div>
<div class="b1 " style="width: 37%;">
<div class="flex-cont " style="height: 24%;">
<div class="nkgs flex-item"> 22,60 </div>
<div class="nkgs flex-item"> 12,50 </div>
</div>
</div>
</div>
</div>
CSS
.flex-cont {
display: flex;
justify-content: flex-start;
flex-flow: column wrap;
align-content: space-around;
align-content: space-evenly;
align-items: flex-end;
}
.flex-item {
/* display: inline-block; */
flex: 0 1 auto;
width: fit-content;
border-bottom:1px dotted black;
}
.b1 {
border: 1px solid black;
--padding: 3px;
-margin: 3px;
display: inline-block;
vertical-align: top;
margin-left: 3px;
margin-bottom: 6px;
}