我一直试图列出一张包含以下内容的表格：
由于this question上的答案，我得到了相当的工作。我在前两列或三列设置“min-width”，在最后一列设置“width”，在中间列中我将文本包装在div中，然后在td和on上设置“max-width” div我设置了width: 100%;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;。所有这些在Chrome和Firefox以及Safari甚至IE 10上都能正常工作。
问题发生在IE7,8和9上。在所有三个“浏览器”中，中间div不会截断，而是推出列的宽度以适应所有文本，这会使表格更宽这页纸。
我尝试在IE上的表上添加一个table-layout: fixed;，但不是得到我所期望的或者实际上任何理智的东西，而是我得到的是所有列都被赋予相同的宽度，忽略了“宽度：220px“在最后一列的td上，然后在所有布局后，最后一列扩展到220px，并吹出表格。如果你不明白我在说什么，请看看
http://jsfiddle.net/ptomblin/rHJk9/
在IE调试器或Chrome或Firefox中的“检查元素”。如果你查看最后一列td的“布局”，它显示的宽度与所有其他列相同，即使内容宽度为220px。
在实际网站上，将“ie8”类放在正文上是使用条件<IF IE8>代码完成的，但jsfiddle似乎不喜欢这样。
我正在寻找的是一种方法，使得表格在IE7-9上的工作方式与在真实浏览器上的方式相同（没有表格布局：固定）或者一些“足够好”的解决办法至少适合屏幕，有或没有表格布局：固定。
http://imgur.com/44DeZv5有一个屏幕截图，显示在IE9上。我添加了一条红线来显示表格的实际边缘。请注意，该表中td中的按钮栏不仅超出了表格，还超出了实际的屏幕宽度。 （浏览器设置为1024x768，表格位于宽度为940像素的.content div内）
当你没有“table-layout：fixed”时，http://imgur.com/0Zielaf就像IE9中的样子一样
http://imgur.com/K8Ob6VR就是Chrome上没有“table-layout：fixed”的样子。请注意它是如何适合屏幕和表格的。这就是我的目标。
答案 0 :(得分：0)
我发现问题导致table-layout: fixed分配所有列的宽度完全相同，无论实际列值的width参数是什么：它发生的原因是第一行在桌子上有一列colspan="7"。我弄清楚了，因为他们在table-layout: fixed的描述中W3Schools提到了：
一旦收到第一行，浏览器就可以开始显示表格了
让我意识到它可能只是看第一行。我在一个带有空列的虚拟第一行中陷入困境，但每个列都有适当的类以给它们适当的宽度，并且它将它们放得更好。 （我还设置了这个虚拟行的字体大小，高度和行高，顶部和底部边距以及填充为0，因此它不会分散注意力）