我有这个：
<table>
<tbody>
<tr>
<td>
<pre style="overflow: scroll;">
(really long lines of text)
JSFiddle：https://jsfiddle.net/x7n8w02f/
在我的场景中，我有以下考虑因素：
<table>不能有table-layout: fixed(在我的真实页面中，<table>有width: 100%，但在JSFiddle中是width: 600px(<td>的宽度变化<pre>中没有换行符，必须保留空白<pre>需要填充<td>的宽度<pre>中的文本不得溢出或溢出到<pre>的视觉边界之外(与<td>相同，不考虑填充和边距(，因此，如果<pre>的文本比<td>宽，则它必须水平滚动
然而，似乎没有任何方法可以做到这一点！
到目前为止，我看到的所有解决方案都对文档和样式表进行了一些限制：
- 在
<table>上使用table-layout: fixed - 使用
overflow: scroll(或overflow-x: scroll(在<pre>上设置绝对宽度，例如width: 500px，但不使用width: 100%(这不起作用( - 我更改了所有的
white-space、word-wrap、overflow和overflow-xCSS属性，但没有任何效果
如果我正确理解了需求，您可以将pre元素放在相对定位的td元素中，作为一个绝对定位的框。就像这样。
table {
border: 1px outset #999;
width: 600px;
}
td, th {
border: 1px inset #999;
}
.pre-container {
position: relative;
}
pre {
border: 1px solid red;
overflow: auto;
position:absolute;
left:0;
right:0;
margin:0;
top:0;
bottom:0;
}<table>
<tbody>
<tr>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
<td class="pre-container">
<pre>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nisl nisi, volutpat eget tempus vitae, iaculis non magna. Phasellus efficitur ante ipsum, eget posuere diam dapibus at. Sed vel leo sit amet sapien feugiat congue. Nunc lorem velit, bibendum eu dignissim eu, efficitur ultrices metus. Suspendisse accumsan dolor ut tortor maximus, et volutpat velit eleifend. Donec commodo malesuada auctor. Proin cursus euismod porttitor. Duis posuere id ex sollicitudin vestibulum. Sed nisi odio, imperdiet ac mollis sit amet, luctus id odio. Fusce laoreet libero non nunc ornare, ac pharetra mi rutrum. Quisque rhoncus vehicula lorem, sit amet consequat neque. Nullam sodales ligula ac orci tincidunt semper. In efficitur magna ut viverra eleifend.
Donec luctus purus nunc, id suscipit nisi dignissim quis. Vivamus vel ligula massa. Proin nec scelerisque ligula. Mauris tristique metus enim. Quisque blandit nunc at nunc maximus laoreet. Nunc nisl sapien, lacinia vitae risus vitae, rutrum interdum nibh. Nunc a sem sem. Ut leo lectus, tempus a sagittis eu, mattis eu orci. Pellentesque dignissim mi diam, et sollicitudin leo facilisis pretium. Ut et tempor dolor. Suspendisse laoreet odio elit, at ultricies justo pellentesque quis. Vestibulum et diam ac ipsum laoreet maximus ac eu elit. Integer et elementum urna.
Curabitur sagittis tortor eu justo laoreet, nec pharetra massa congue. Duis hendrerit venenatis diam, non suscipit arcu. Quisque aliquam pretium mauris, ac cursus risus eleifend nec. Nulla non sem ac mi auctor tempus in nec velit. In cursus vel ex nec pellentesque. Etiam consequat eget libero nec dictum. Vestibulum viverra neque vel urna semper vehicula. Praesent ac felis sollicitudin, convallis nisi vel, consequat lorem. Morbi eu elit at enim tempor maximus vel ut magna. Integer dignissim convallis consequat.
Fusce aliquam libero in sem volutpat rhoncus. Suspendisse vulputate interdum nibh non efficitur. Morbi massa dolor, egestas a sodales a, rhoncus quis turpis. Vivamus velit erat, rutrum vitae lectus sed, luctus vulputate augue. Aenean elementum tortor eros, eget hendrerit purus viverra eget. Praesent ultricies pulvinar gravida. Nullam pulvinar feugiat laoreet. Fusce sit amet est facilisis, mattis erat a, consectetur felis. Sed eleifend faucibus felis, eget auctor nunc egestas suscipit. Sed in lobortis mi. Phasellus aliquet elit at tristique ullamcorper. Nullam augue eros, ornare et nisl ac, tempor volutpat sem. Praesent in felis vehicula, imperdiet mi eget, laoreet diam.
Praesent at tellus diam. Fusce vulputate, ipsum non vulputate vehicula, elit sem viverra mi, eu suscipit arcu leo et mi. Curabitur nec dolor ultrices, bibendum eros hendrerit, gravida ex. Donec ac porttitor erat. Nullam gravida egestas mi, vel tristique ante suscipit nec. Nullam ut ante rhoncus nisi varius feugiat. Pellentesque aliquet tincidunt ante vitae sollicitudin.</pre>
</td>
</tr>
<tr>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</td>
</tr>
</tbody>
</table>