我在一个单元格中有很长的数据，我需要把数据放在一行中的特定宽度，其余的则 Package 到下一行。我已经能够使它在一行中，但不能在特定宽度后用td{word-wrap：断字}，可能是因为td{white-space：我不想在这个词的中间打个结。
样式和HTML结构将用于在ERP中创建表。
我有以下CSS：
``
th { /* header cell */
border-bottom: 2px solid #EB9486;
position: sticky;
top: 0;
background-color: #F9F8F8;
}
td { /*body cell */
white-space: nowrap;
border: 1px solid black;
}
/*Adds scroll to the table*/
.table-container {
overflow: auto;
height: 300px;
}
``
``
<div class="table-container">
<table>
<thead>
<tr>
<th class="FirstHeader">Name</th>
<th class="SecondHeader">Job</th>
<th>Salary</th>
<th>Name</th>
<th>Job</th>
<th>Salary</th>
<th>Name</th>
<th>Job</th>
<th>Salary</th>
<th>Name</th>
<th>Job</th>
<th>Salary</th>
<th>Name</th>
<th>Job</th>
<th>Salary</th>
<th>Name</th>
<th>Job</th>
<th>Salary</th>
<th>Name</th>
<th>Job</th>
</tr>
</thead>
<tbody>
<tr class="FirstColumn">
<td>Olivia Saturday</td>
<td>Senior Data Engineer</td>
<td>$320,000</td>
<td>David Smith</td>
<td>Manager Strategic Finance Manager Strategic Finance Manager11</td>
<td>$180,000</td>
<td>David Smith</td>
<td> Manager Strategic Finance Manager Strategic Finance Manager</td>
<td>$180,000</td>
<td>David Smith</td>
<td> Manager Strategic Finance Manager Strategic Finance Manager</td>
<td>$180,000</td>
<td>David Smith</td>
<td> Manager Strategic Finance Manager Strategic Finance Manager</td>
<td>$180,000</td>
<td>David Smith</td>
<td> Manager Strategic Finance Manager Strategic Finance Manager</td>
<td>$180,000</td>
<td>David Smith</td>
<td>Manager Strategic Finance Manager Strategic Finance Manager</td>
<td>$180,000</td>
<td>David Smith</td>
<td>Manager Strategic Finance Manager Strategic Finance Manager</td>
<td>$180,000</td>
</tr>
<tr class="SecondColumn">
<td>David Smith</td>
<td> Manager Strategic Finance Manager Strategic Finance Manager</td>
<td>$180,000</td>
</tr>
<tr>
<td>Margaret Mills</td>
<td>Lead Software Engineer</td>
<td>$250,000</td>
</tr>
<tr>
<td>Paul Brown</td>
<td>Digital Content Writer</td>
<td>$145,000</td>
</tr>
<tr>
<td>Stephanie Tavartkiladze</td>
<td>Digital Project Manager</td>
<td>$250,000</td>
</tr>
<tr>
<td>Olivia Saturday</td>
<td>Senior Data Engineer</td>
<td>$320,000</td>
</tr>
<tr>
<td>David Smith</td>
<td>Strategic Finance Manager</td>
<td>$180,000</td>
</tr>
<tr>
<td>Margaret Mills</td>
<td>Lead Software Engineer</td>
<td>$250,000</td>
</tr>
<tr>
<td>Paul Brown</td>
<td>Digital Content Writer</td>
<td>$145,000</td>
</tr>
<tr>
<td>Stephanie Tavartkiladze</td>
<td>Digital Project Manager</td>
<td>$250,000</td>
</tr>
<tr>
<td>Olivia Saturday</td>
<td>Senior Data Engineer</td>
<td>$320,000</td>
</tr>
<tr>
<td>David Smith</td>
<td>Strategic Finance Manager</td>
<td>$180,000</td>
</tr>
<tr>
<td>Margaret Mills</td>
<td>Lead Software Engineer</td>
<td>$250,000</td>
</tr>
<tr>
<td>Paul Brown</td>
<td>Digital Content Writer</td>
<td>$145,000</td>
</tr>
<tr>
<td>Stephanie Tavartkiladze</td>
<td>Digital Project Manager</td>
<td>$250,000</td>
</tr>
<tr>
<td>Olivia Saturday</td>
<td>Senior Data Engineer</td>
<td>$320,000</td>
</tr>
<tr>
<td>David Smith</td>
<td>Strategic Finance Manager</td>
<td>$180,000</td>
</tr>
<tr>
<td>Margaret Mills</td>
<td>Lead Software Engineer</td>
<td>$250,000</td>
</tr>
<tr>
<td>Paul Brown</td>
<td>Digital Content Writer</td>
<td>$145,000</td>
</tr>
<tr>
<td>Stephanie Tavartkiladze</td>
<td>Digital Project Manager</td>
<td>$250,000</td>
</tr>
</tbody>
</table>
</div>
``字符串
如果我不使用td{white-space: nowrap;}，由于列的数量，数据会被 Package 。也许我应该改变HTML。我不知道我不知道我糊涂了。请帮帮我
2条答案
按热度按时间wkyowqbh1#
不太确定我是否理解了这个问题，但是你可以在td标签中使用nowrap关键字：
选项一：
字符串
如果你需要一个固定的宽度，你也可以创建一个类...
选项二：
联系我们
型
css：
型
或执行内联样式
选项三：
型
mnemlml82#
基本上我认为你的问题源于一个失踪的专栏，也许这是扔你？
下面的代码应该会给予你一个没有换行的滚动表。如果Show_Empty_Cells是Experiment with it，尝试更改样式并查看更改后的效果，那么可能空（合并）单元格并不是真正必要的。
字符串