用页脚隐藏的多行文本溢出答案

【问题标题】：Multiline text overflow hidden with footer用页脚隐藏的多行文本溢出
【发布时间】：2020-11-20 01:07:12
【问题描述】：

您好，我有一个 flex 容器，其中包含一些元素，其中一个应该是带有标题的 div、由图像和长文本组成的内容以及页脚。

所有元素的高度都应该相同，但我在将这个精确的 div 设置为正确的高度时遇到了麻烦。你可以查看here

您可以看到我的 div #article 周围有一个边框，并且带有页脚的文本正在穿过它。我希望文本像 text-overflow: ellipsis; 但没有 white-space: nowrap; 并且页脚位于边框上，所以我的 flex 容器的所有子项

【问题讨论】：

【解决方案1】：

您应该删除#une, #article, #important 上的max-height 并将其放在.contentArticle .textArticle 上，但您不会有省略号。

当您想要显示多行时，text-overflow: ellipsis; 很棘手。

这里有一个关于如何只使用 css 的教程：https://css-tricks.com/multi-line-truncation-with-pure-css/ 或者你可以使用Javascript

【讨论】：