解决flex元素内部文本溢出的问题min-width: 0

1、在Flexbox布局中，当容器空间不足时，项目通常应该收缩以适应容器。
2、但是，flex项目的默认min-width值是auto，这意味着项目的最小宽度是其内容的宽度。
3、对于包含长文本的元素，其内容宽度可能是整个文本的宽度，这会导致即使在flex容器中设置了收缩属性，项目也不会收缩到比其内容更小。
4、通过显式设置min-width: 0，我们覆盖了默认行为，允许flex项目收缩到0宽度（或者容器允许的任何最小宽度）。
5、这样，即使文本很长，容器也能正确地收缩并在必要时显示省略号（配合overflow: hidden和text-overflow: ellipsis）。
这是一个Flexbox布局中的经典问题，通常被称为"flex item不收缩"问题。添加min-width: 0是解决此问题的常用方法之一。