css - 在将文本全部放入另一列之前，如何更喜欢将文本换行？

Question

最后，我想我发现了一个以前没有人问过的问题。我有一个有两列的表。第一列有时可能有一个非常非常长的词。第二列总是有很多简短的单词，它们包装得很好。如果我将 word-break:break-all 应用于第一列，然后缩小我的浏览器窗口，当我希望在进行丑陋的 break-all 换行之前将所有短词包装在第二列中时，这些列将保持 50/50第一列。

<table>
  <tr>
    <td style="word-break:break-all;">reallyreallyreallyreallylongword</td>
    <td>Here are a lot of short words that wrap nicely</td>
  </tr>
</table>

我需要在所有列中包装所有可能的可换行词，然后再诉诸丑陋的破坏，但仍将其作为防止溢出的最后手段。哪些列最终更宽并不重要。

Answer 1

因此，如果您为两列指定百分比宽度，其中一列大于另一列，则较大的列将需要更长的时间才能开始缩小文本。

例如：

    <table>
      <tr>
         <td class="widecolumn">reallyreallyreallyreallylongword</td>
         <td class="smallcolumn">Here are a lot of short words that wrap nicely</td>
      </tr>
    </table>

    table {
      max-width:1000px;
      width:100%;
    }

    td {
      word-break:break-all;
    }
    td.widecolumn {
      width:65%;  
    }
    td.smallcolumn {
      width:35%;
    }

工作示例：https ://codepen.io/FEARtheMoose/pen/XPKPNZ