Html CSS-限制单元格宽度不超过剩余空间
在我下面的示例中，最重要的是wideData类选择器。我想用它来使被wideData div包围的文本显示在滚动框中，如果它不能以其他方式显示，则会导致水平滚动条出现在包含的浏览器窗口overflow:auto上 如果div不包含在表单元格中，请尝试删除示例中的table、td和td元素，您就会明白我的意思。然而，如果我把它放在一个表格单元格中，包含的文本总是占据它想要的空间，用户必须滚动包含的页面才能看到文本的右侧 我不想在表格或单元格上指定绝对宽度。这种布局是在我想显示大量文本的情况下使用的，这些文本可以正常换行，但偶尔会散布一些非常宽的文本块，这些文本块必须在不换行的情况下显示，并且应该显示在它们自己的滚动框中，而不会导致包含的页面变得非常宽。我不想给div元素设置一个绝对宽度——我想显示尽可能多的宽文本，我知道我的用户没有标准的屏幕/浏览器宽度Html CSS-限制单元格宽度不超过剩余空间,html,css,html-table,overflow,Html,Css,Html Table,Overflow,在我下面的示例中，最重要的是wideData类选择器。我想用它来使被wideData div包围的文本显示在滚动框中，如果它不能以其他方式显示，则会导致水平滚动条出现在包含的浏览器窗口overflow:auto上 如果div不包含在表单元格中，请尝试删除示例中的table、td和td元素，您就会明白我的意思。然而，如果我把它放在一个表格单元格中，包含的文本总是占据它想要的空间，用户必须滚动包含的页面才能看到文本的右侧 我不想在表格或单元格上指定绝对宽度。这种布局是在我想显示大量文本的情况下使用的
<html>
<head>
<style>
.wideData
{
background-color:red;
overflow:auto;
}
</style>
<title>Example</title>
</head>
<body>
<table width="100%">
<tr>
<td>
A
<div class="wideData">
<pre>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</pre>
</div>
B
</td>
</tr>
</table>
</body>
</html>
PS您可能会问我为什么要混合使用表格和CSS，或者我是否必须使用这种布局。我的生活受限于一个不受我控制的系统生成的内容。我可以更改CSS规则-如果Push可以使用Greasemonkey之类的工具在客户端更改已交付的HTML，我无法在服务器端更改它。很抱歉回答我自己的问题 缺少的成分似乎是表布局：固定-这似乎达到了我想要的效果 这是从哪里来的