如何强制表格行进行分词？

Question

我有以下元素层次结构：

而且，这是渲染：

我想摆脱水平滚动并用单词中断替换它（所以，不要在单词边界上拆分）。

启用此功能的正确css设置是什么？

Answer 1

如果我做对了，你要做的就是摆脱滚动条，保持宽度并仅为.igv-popoverValue跨度（右侧的跨度）添加单词中断。如果是这样，您可以将.igv-popoverName向左移动，将.igv-popoverValue向右浮动并为其宽度设置在列侧，类似this example

<td class="igv-popover-td">
    <div class="igv-popoverNameValue">
        <span class="igv-popoverName">Name</span>
        <span class="igv-popoverValue">NUP210L</span>
    </div>
</td>

和CSS

.igv-popoverName {
    float: left;
    width: 45px;
}
.igv-popoverValue {
    word-break: break-all;
    float: right;
    width: 45px;
}