Let's look at how easy it is to change the layout direction by adding the flex-direction property with a value of column. This property applies to the .columns flex container. I've also removed the pink border as well.
/****************3 columns****************/.columns { display: flex; flex-direction: column;}.column {}
We'll save this and boom! We went from horizontal to vertical:
Some of our center alignment, which we probably wanted, has gone; however, the layout is vertical nonetheless. So that's interesting.
Another thing we can is set the flex-direction to be column-reverse:
/****************3 columns****************/ ...
