在 Chrome 中,我有一个属性 overflow-x: hidden 在表的 td 上。当单元格的内容超出单元格时,其余内容将被隐藏。当我在 IE11 中测试这个时, 的内容被隐藏了;但是,出现了一个讨厌的垂直滚动条,我不确定为什么。这是它的样子:
如果我在开发工具中取消选中该属性,则垂直滚动条会消失,但是内容会溢出到行中。有什么办法可以解决这个问题吗?
最佳答案
好吧,既然你想在超出单元格空间时隐藏单元格的内容,你应该尝试使用文本溢出,例如:
<table class="custom">
<tr>
<td>
long long long long lonnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnng
</td>
<td>
long long long long lonnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnng
</td>
<td>
long long long long lonnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnng
</td>
</tr>
<tr>
<td>
long long long long lonnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnng
</td>
<td>
long long long long lonnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnng
</td>
<td>
long long long long lonnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnng
</td>
</tr>
</talble>
和CSS:
.custom td {
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
关于css - 溢出-x : hidden in IE11 creates vertical scrollbar,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45417354/