关于display:flex碰上white-space nowrap的问题

Question

1、当display:flex碰上white-space nowrap的时候，会打乱flex布局。我别人的帖子说给flex布局级设置最小宽度为0，再给包含的元素设置宽度就可以实现了。我给类名喂content设置宽度为0了以后就正常显示了。想知道一下为什么。我找了很多帖子也没看明白。

Answer 1

w3c上面是这样说的

By default, flex items won’t shrink below their minimum content size (the length of the longest word or fixed-size element).

因为设置了white-space:nowrap，所以content没法收缩了，设置0后就有了固定尺寸就可以收缩了

Answer 2

给content设置最小宽度0不好理解,给.content选择器添加overflow: hidden;就好了