Inside a webpage I need to organize a series of similar cards. So I used the d-flex and flex-wrap for the elements container and flex-fill for the elements themselves to make the layout as neat as possible.
<div class="d-flex flex-wrap">
<div class="p-2 flex-fill">Flex item 1</div>
<div class="p-2 flex-fill">Flex item 2</div>
...
<div class="p-2 flex-fill">Flex item 14</div>
</div>
while I was expecting these classes make the layout like this:
they've actually formed the layout like this:
which is not what I meant considering the items look really weird when they stretch more than how they intended to.
