Question

我正在使用表格来显示一组数据，我的HTML代码就在这里......

<table border="1" cellspacing="0" cellpadding="0" style="width: 780px;">
  <tbody>
    <tr>
      <td style="width: 780px; height: 25px;">
        <pre width='100' style='width: 780px; word-wrap: break-word;'>
            the data goes here.....
        </pre>            
      </td>
    </tr>
    <tr>
      <td style="width: 780px; height: 25px;">
        <pre width='100' style='width: 780px; word-wrap: break-word;'>
            the data goes here.....
        </pre>            
      </td>
    </tr>
  </tbody>
</table>

这个表在firefox，safari和IE8中运行正常。但问题出现在IE7，IE6中。当桌子扩展并离开屏幕时（即在x轴向右侧扩展）.... 有没有修复它的黑客？

IETester中IE6的屏幕截图：

enter image description here

Answer 1

使用下面的CSS，这可以防止您的表超出您定义的最大大小：

table{
  table-layout:fixed;
}

Answer 2

问题解决了，因为我使用了代码

<table border="1" cellspacing="0" cellpadding="0" width="780" style="table-layout:fixed">
<col width="780">
<tbody>
<tr>
  <td style="width: 780px; height: 25px; overflow:hidden;">
    <pre width='100' style='width: 780px; word-wrap: break-word;'>
        the data goes here.....
    </pre>            
  </td>
</tr>
<tr>
  <td style="width: 780px; height: 25px; overflow:hidden;">
    <pre width='100' style='width: 780px; word-wrap: break-word;'>
        the data goes here.....
    </pre>            
  </td>
</tr>
</tbody>
</table>

在上面的代码中有三处变化......

在表格标签中设置了width属性（而不是在style属性中设置）
col tag设置的宽度与表格宽度相同
并且在TD的样式中溢出被设置为隐藏，（溢出：隐藏）。

我从以下链接获得此信息，请大家查看... “http://www.tek-tips.com/faqs.cfm?fid=4499” 因此我的问题得到了解决。

Answer 3

您还可以尝试 word-break：break-all;

的样式

Answer 4

尝试

<table border="1" cellspacing="0" cellpadding="0" width="780">

Answer 5

我刚刚使用你的HTML进行测试，它在IE6，IE8（兼容模式）和IE8（普通模式）中看起来相同，在Firefox中也是如此。

您网页上的其他内容必须影响布局，因此请发布完整的示例。

这是我测试的完整示例。

<html>
    <body>
        <table border="1" cellspacing="0" cellpadding="0" style="width: 780px;">
          <tbody>
            <tr>
              <td style="width: 780px; height: 25px;">
                <pre width='100' style='width: 780px; word-wrap: break-word;'>
                    the data goes here.....
                </pre>            
              </td>
            </tr>
            <tr>
              <td style="width: 780px; height: 25px;">
                <pre width='100' style='width: 780px; word-wrap: break-word;'>
                    the data goes here.....
                </pre>            
              </td>
            </tr>
          </tbody>
        </table>
    </body>
</html>

IE中的HTML表格宽度？

5 个答案: