0

为什么我在 IE 中设置固定宽度时第一列宽度太大?

我的代码:

<!DOCTYPE html>
<html >
<head>
    <title>Test</title>
</head> 
<body>
<table  width="100%" border="1">
<tr>
    <td style="width:180px;"> 2 </td>
    <td>6 </td>
</tr>
<tr>
    <td colspan="2" >
            lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        lskdjf lskfj lskjf lksfj lksf lksd flksflksfj lskf jlksf jlk        
    </td>   
</tr>    
</table>
</body>
</html>

输出:

输出 第一列太大,我将第一列的宽度设置为 180px

<td style="width:180px;">
4

1 回答 1

1

本地 Internet Explorer 模式“修复”

我只能通过将 IE 的 Document Mode 更改为IE5 quirks来重现此问题,所以我只能假设这就是您将 IE 设置为的内容。默认情况下,无论您使用哪个版本,JSFiddle 都应该以标准模式加载。

要解决这个问题,只需敲击F12键盘打开 IE 的开发者工具,然后在出现的 UI 的顶部栏上选择文档模式并将其更改为“标准(页面默认)”:

IE修复

IE5 怪癖模式 CSS 修复

或者,您可以在 IE5 怪癖模式下解决此问题,只需给表一个固定的table-layout. 在您的 CSS 中,只需添加:

table {
    table-layout:fixed;
}

这是一个更新的 JSFiddle 演示

于 2013-10-07T11:50:39.977 回答