Three of the four boxes are given widths. The box in the second place is given box-flex:1. It fills the remaining space. If it's given no width, it will be as wide as the content within it all on one row.This works no matter which box I place the box-flex property on.
1 - Lorem Ipsum only a little bit now. Lorem Ipsum only a little bit now. But add even a slight difference...
2 - Lorem Ipsum only a little bit now. Lorem Ipsum.
3 - Lorem Ipsum only a little bit now. Lorem Ipsum only a little bit now. Vary the content be even a tiny bit, and the box with more content (or the first one) will grow larger than the rest.
4 - Lorem Ipsum only a little bit now. Lorem Ipsum only a little bit now.
Lorem Ipsum only a little bit now. Lorem Ipsum only a little bit now. Vary the content be even a tiny bit, and the box with more content (or the first one) will grow larger than the rest.