css多行省略却导致内容溢出

写多行省略时，出现了内容溢出情况，如下图


内容溢出情况.png

这是我多行省略的代码


多行省略代码.png

查阅百度后，发现浏览器默认是不会在单词内部换行的,只会在单词间换行。这样单词太长就无法换行,导致溢出，设置了溢出隐藏后,内容无法换行就会被截断隐藏,看起来就像是溢出了。

解决方法

在要换行的内容样式中加一个单词强制换行就行了
word-break: break-all;
效果如下

正确的显示.png

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容