单行、多行省略为什么有时不生效？Flex 子项如何防撑宽？
先理解原理和示例，再练习完整口述与追问。
回答要点
有可约束尺寸才有溢出；nowrap/overflow/ellipsis 配合；Flex 自动最小尺寸；多行方案与兼容；可访问完整内容。
原理拆解
单行省略要求文本在有限可用宽度里溢出，通常需要 white-space:nowrap、overflow:hidden 和 text-overflow:ellipsis 配合。如果 Flex 子项的最小内容尺寸阻止它收缩，外部容器先被撑大，就不会在期望宽度产生省略，需要在适当子项设置 min-width:0。多行 clamp 则按目标环境采用支持的标准或兼容组合。
示例与推演
.row { display: flex; gap: 12px; }
.title { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.description { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
按钮保留必要尺寸，title 占剩余宽度后才能正确省略。内容是代码或表格时，局部滚动往往比省略重要信息更合适。
易错点
只写 ellipsis 不会强制产生省略；只靠 hover 的 title 展示完整内容对手机和键盘用户不充分。
参考回答可直接练习口述
我先确认尺寸与收缩约束，再配合溢出和换行规则。Flex 常需要 min-width:0，多行按浏览器能力处理，并给用户可操作的查看完整内容入口。