Question

当我使用固定宽度（IE 7）时，我无法使用colspan工作？为什么呢？！

示例代码：



<html>
  <head>
    <style>
    .inputGroup td
    { width:250px; }    
    </style>
  </head>
<body>
<table class="inputGroup">
  <tr>
    <td>cell1</td>
    <td>cell2</td>
  </tr>
  <tr>
    <td colspan="2">This should span two columns but it doesnt</td>
  </tr>
  <tr>
    <td>cell1</td>
    <td>cell2</td>
  </tr>
</table>
</body>
</html>

<html> <head> <style> .inputGroup td { width:250px; } </style> </head> <body> <table class="inputGroup"> <tr> <td>cell1</td> <td>cell2</td> </tr> <tr> <td colspan="2">This should span two columns but it doesnt</td> </tr> <tr> <td>cell1</td> <td>cell2</td> </tr> </table> </body> </html>

帮助任何人？：（

Answer 1

确实如此，但你限制了宽度。如果需要，尝试创建另一个名为“.doubleSpanInputGroup”的类或宽度为500的类，并将该类设置为生成列。

例如

<html>
  <head>
    <style>
    .inputGroup td
    { width:250px; }   
    .inputGroup td.doubleInputGroup
    { width:500px; } 
    </style>
  </head>
<body>
<table class="inputGroup">
  <tr>
    <td>cell1</td>
    <td>cell2</td>
  </tr>
  <tr>
    <td colspan="2" class="doubleInputGroup">This should span two columns but it doesnt</td>
  </tr>
  <tr>
    <td>cell1</td>
    <td>cell2</td>
  </tr>
</table>
</body>
</html>

编辑：使新风格更加层次化

Answer 2

尝试将规则应用于tr而不是td，并将宽度设为500px，如下所示：

.inputGroup tr { width: 500px; }

您遇到的问题是因为您已将td的限制设置为最多250px宽，因此浏览器只是按照您的说明操作。

Answer 3

一般来说：

table tr:first-child td:first-child{ width:86px; }

如果这是唯一的宽度，则所有第一列都采用此宽度，并且ie7中的colspan将起作用

Answer 4

我试图将colspan单元格的宽度设置为auto，似乎在IE7 / 8/9中工作正常

.yourColSpanTD { width: auto !important; }

Colspan不适用于宽度设置？（IE7）

4 个答案:

Colspan不适用于宽度设置？ （IE7）

4 个答案:

Colspan不适用于宽度设置？（IE7）