How do I make a flexbox switch to column mode when there isn't enough room for row mode?
<p>I have a flexbox like this:</p>

<p><a href="https://i.stack.imgur.com/zJFi7.png" rel="noreferrer"><img src="https://i.stack.imgur.com/zJFi7.png" alt="Three boxes side-by-side"></a></p>

<p>When the container is too narrow, it wraps like this:</p>

<p><a href="https://i.stack.imgur.com/62Zka.png" rel="noreferrer"><img src="https://i.stack.imgur.com/62Zka.png" alt="Two boxes on the first row, and one box on the second row"></a></p>

<p>But I want it to do this:</p>

<p><a href="https://i.stack.imgur.com/7BoZj.png" rel="noreferrer"><img src="https://i.stack.imgur.com/7BoZj.png" alt="Three boxes stacked vertically"></a></p>

<p>In other words, when the flexbox wraps, I want it to wrap <em>everything at once.</em>  It's either completely horizontal or completely vertical.</p>

<p>The flexbox elements aren't all necessarily the same size.</p>

<p>Can it be done?</p>