The solutions to this problem are multiple. From setting a min-height
to each container, to using tables display flex
. But the one I prefer the most is declaring/using tables
. Mainly because you eliminate all possible cross-browser issues that can arise based on the method you choose. Not only that but it is a clean easy way of getting the desired result. As you can see in the example bellow the second element has much more content than the rest because of its table structure the rest of the columns copy the size of their "bigger brother".
Result Box
- html
- css