我的情況：我正在為移動用戶制作一個表格，我有一個 html 表格。
我如何應用 CSS 以便
所有單元格 (td) 都被強制不中斷單詞，而僅在空格處中斷。（
white-space: nowrap;不是可接受的解決方案。）所有列都應擴展寬度（忽略寬度限制，如果溢位則 idc，因為我將使其可滾動）以確保沒有分詞，而僅在空格處中斷。
<div style="overflow: scroll;">
<table>
<thead>
<!-- some header -->
</thead>
<tbody>
<tr>
<td>Some text</td>
<td>Some evenlongertext with words in multiple_lines</td>
<td>Some supersupersuperlong text.</td>
</tr>
<!-- etc., more rows. -->
</tbody>
</table>
</div>編輯 1：
我的桌子目前在移動螢屏上看起來像這樣，以供參考：
我希望它擴大寬度以確保沒有斷字，代價是水平溢位。
EDIT 2:
Clarification on word wrapping:
I want it to grow, but not to the point that the entire string does not break. e.g. for the string "Some evenlongertext with words in multiple_lines",
it doesn't have to show like
Some evenlongertext with words in multiple_lines
, but it can show like
Some
evenlongertext
with words in
multiple_lines
where there is no break within each word
Edit 3:
It looks like the overhead stylesheet for my entire site (which I can't change) has set word-break: break-word;
uj5u.com熱心網友回復：
您可以將每個單元格用作一個 div，如果您使用 flex-box，它將自動回應，這對移動應用程式有好處。只需在所有單元格 (div) 周圍創建另一個 div，并為該 div 指定類wrapper或container. 這將是你的 css
wrapper {
display: flex;
justify-content: center;
}
.cell {
height: 100px;
width: 100px;
}
uj5u.com熱心網友回復：
我會使用 css grid 或 flex-box 而不是 table
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/345053.html
標籤：html css html-table