2

请看下面的html：

      <table style="width: 700px;table-layout: fixed ; margin-top: 30px;" cellpadding="0" cellspacing="0">
        <tr class="tableHeader">
          <td width="220px">Event Name</td>

          <td width="120px">City</td>
          <td width="77px">Date</td>
          <td width="110px">Price</td>
          <td width="80px">Status</td>
          <td width="60px">Select</td>
        </tr>
    </table>

    <div style="overflow: auto;height: 360px; width: 730px;">
        <table style='width: 700px;table-layout: fixed;' cellpadding='0' cellspacing='0'>
                <tr >
                    <td colspan='6' >adnanpo </td>
                </tr>
                <tr >
                    <td width='220px' >adnanpo </td>
                    <td width='120px' > </td>
                    <td width='77px' >04/20/2012 </td>
                    <td width='110px' >USD $30.00 </td>
                    <td width='80px' >Paid </td>
                    <td width='60px' >
                        <input class='orgOkButton' type='button' id='btnOpenOrder' name='btnOpenOrder' onclick='return openOrderWindow('/RealResource/submitorder.aspx?OId=35731&EvtId=771')</td> 
                </tr>
            </table>
        </div>

以下部分解决了这个问题：

                <tr >
                    <td colspan='6' >adnanpo </td>
                </tr>

在此处输入图像描述

请看图，列宽有问题！！请帮我修复它！

4

5 回答 5

4

显而易见的解决方案是删除tr导致问题的元素。这里似乎没有功能。如果您只需要一些间隔，div请在两个表之间放置一个元素。

出现问题是因为table-layout: fixed告诉浏览器根据第一行决定列宽，如果宽度没有以某些其他方式设置。这里第一行只有一个跨越所有列的单元格，然后定义的行为是在列之间平均划分宽度。

或者，明确设置列宽，例如使用

    <col width=220>
    <col width=120>

等在每个<table>标签之后。但请确保宽度的总和与您设置为表格总宽度的数字相加（目前没有）。当col以这种方式使用元素来设置所有列宽时，浏览器将毫无疑问地使用这些确切的宽度（这可能会导致问题，但我想你已经考虑过了）。

于 2012-05-11T10:46:26.967 回答
3

删除第二个表中的 'table-layout' 属性，它会正常工作。并关闭你的输入元素（onclick="return openOrderWindow('/RealResource/submitorder.aspx?OId=35731&EvtId=771')"/>）

于 2012-05-11T10:28:54.753 回答
2

如果我理解正确，您担心您的列未与顶部对齐。

我首先建议您使用以下 CSS：

table { empty-cells: show; }

这将允许您必须填写空白单元格。（否则你可以&nbsp;在它的空白处放一个）。

另外，如果可以的话，我建议你使用一张连续的表格。

于 2012-05-11T10:30:28.437 回答
0

关闭您的输入标签 - > 丢失了。如果问题仍然存在，我们可以进一步观察。

于 2012-05-11T10:30:44.803 回答
0

是的colspan，在表格的“第一行”中使用就是这种情况。为了解决这个问题，你可以做这样的事情（同样只是第一行 - 你可以在colspan下面使用 fine）：

                <tr>
                    <td width="220px"><div style="position:absolute;width:220px;">adnanpo</div></td>
                    <td width="120px"></td>
                    <td width="77px"></td>
                    <td width="110px"></td>
                    <td width="80px"></td>
                    <td width="60px"></td> 
                </tr>
于 2012-05-11T10:33:18.553 回答