• 周日. 11月 27th, 2022

5G编程聚合网

5G时代下一个聚合的编程学习网

热门标签

overflow:hidden导致元素高度增加的问题

admin

11月 28, 2021
display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;

overflow: hidden 会导致元素的高度增加,去掉 overflow: hidden 后又不能实现省略号

原因是overflow:hidden和display: inline-block一起使用时会造成baseline的移动

只需给元素添加 vertical-align: bottom; 即可解决该问题

最终的元素样式

display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; vertical-align: bottom;

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注