How to prevent flexboxes from shrinking?

Question

I have two flexboxes which shrink on height change and nested content gets overlapped. How to prevent this?

Answer 1

just add flex-shrink:0 to your element and the flexbox will stop shrinking.

<div class="flx">
    Some Content
</div>

<div class="flx">
    Some Content
</div>

<style>
    .flx{
        display: flex;
        flex-shrink: 0;
    }
</style>