html表应该溢出

我有一个两列的表。第一个（包含菜单）的固定宽度应为，而第二个（包含某些页面内容）的宽度可能会有所不同。该表应该溢出窗口（默认情况下不会），因为如果内容非常广泛，浏览器会减小菜单列的宽度。但是我无法为表格定义一个固定的宽度（导致它溢出），因为我不知道内容的宽度。html表应该溢出

Overflow:scroll

似乎不适用于表格。我会感谢解决方法/解决方案。

<table class="rootTableContent"> 
<tr> 
    <td id="rootTableMenu">    
    </td> 
    <td id="rootTableContent"> 
    </td> 
</tr>

来源

2011-03-29 AGuyCalledGerald

你将需要提供更多的代码比。我不确定你面临的是什么问题。也许在www.jsfiddle.net上发布一些代码 – Dutchie432 2011-03-29 16:44:22

您是否仅将表格用于布局？ – 2011-03-29 16:47:03

表应该溢出什么？如果你不给表的固定宽度，那么它会拉伸以适应它的容器。这就是它的工作原理。我建议绘制你想要的页面行为的图表，然后我们可以建议正确的HTML和CSS来实现它。（答案可能不是TAble） – 2011-03-29 16:48:51

解决这个问题是使用适当的CSS（Div时/跨度，等等）来布置你的网站，而不是表。我全都使用表来显示表格数据，你会看到我在他们有效的地方为他们辩护，但这不是其中之一。

这是很容易的是这样完成的：

<div style="float:left; width: 150px"> 
    Navigation Code Here 
</div> 
<div style="float: left"> 
    Other Content Here 
</div> 
<div style="clear:both"></div>

很显然，我在这个简单化的解决方案，你将有更具体的代码来处理您的布局（需要更多的细节，以帮助更多特别是）但是，为工作使用正确的工具很重要。

来源

2011-03-29 17:01:43 bpeterson76

“易”是什么意思？它需要很长的时间才能改变整个布局，而这几乎不可能在有限的时间内完成。 – AGuyCalledGerald 2011-03-30 15:40:34

@ Jan-Frederik Carl，我不同意。它只需要额外的时间，直到你适应正确的CSS布局。我同样被拖到那里踢和尖叫。但出于比较的目的，我可以在3小时内将完整的网站剪切并从.psd汇编成完全兼容的CSS。就像保持您的示例代码一样基本，我希望这不会超过20-30分钟，以HTML和CSS进行汇编，从头到尾。 – bpeterson76 2011-03-30 20:55:56

正如其他人所说，请不要使用<table>布局。它陈旧，笨重，并且使屏幕阅读器和其他辅助功能软件混淆。

如果你绝对坚持使用你的方法，你可以试试这个：

Live Demo

<style type="text/css"> 
div.wrap { 
    overflow-y: auto; 
    width: 75%; 
} 
div.wrap table { 
    border: 1px solid #000; 
    width: 100%; 
} 
div.wrap table td { 
    padding: 20px; 
} 
</style> 

<div class="wrap"> 
    <table class="rootTableContent"> 
    <tr> 
     <td id="rootTableMenu">rootTableMenu</td> 
     <td id="rootTableContent">rootTableContent</td> 
    </tr> 
    </table> 
</div>

来源

2011-03-29 17:05:53 drudge

我不得不提，我没有建立这种布局！ – AGuyCalledGerald 2011-03-29 17:11:43

继承糟糕的代码从来没有乐趣。 – drudge 2011-03-29 17:14:33

html表应该溢出

回答

相关问题