html - 将具有长选项值的选择元素放入表格单元格

Question

这里是我的问题示例。 https://jsfiddle.net/f9177pzk/5/ .确保将 jsFiddle 窗口宽度扩展到足够大，以便所有 3 个框都在同一行上。

我使用的是 Bootstrap，但在这种情况下，我覆盖了一些 form-control 样式以使选择更 slim 。

如您所见，select 元素导致其他 td 元素分成两行。我希望所有 td 单元格都适合一行。

在这个例子中https://jsfiddle.net/f9177pzk/6/ , 如果选项值足够短，选择将很适合。

有没有办法强制选择适合，同时仍然保持长选项值？

这是我到目前为止尝试过的 CSS

select.form-control{
    height: 18px;
    padding: 0px;
    font-size: 12px;
    width: 90%;
}

Answer 1

试试这个:

.ca-info-table tr td:first-child {
  white-space: nowrap;
}