用单列覆盖整行 - 宽度问题答案

【问题标题】：Cover entire row with a single column - width issue用单列覆盖整行 - 宽度问题
【发布时间】：2013-08-08 18:07:25
【问题描述】：

我有中继器和表格控件。我的桌子有一列。当我运行代码时，行中的每个单元格覆盖了大约 25%（基于单元格的内容）的行和背景颜色也仅针对该区域发生变化。我希望单元格覆盖整行。以下是代码。我将列宽设置为 100%，但它并没有解决问题。我不想硬编码单元格的宽度。

        <div style="overflow-y: auto; width: 100%; height: 395px; border: 0px solid #3C454F; background-color: #FFFBE6; border: 0px solid #3C454F;">
            <asp:Repeater ID="TestList" runat="server">
                <HeaderTemplate>
                    <table>
                </HeaderTemplate>

                <ItemTemplate>
                    <tr style="background-color: aqua; padding-top: 5px">
                        <td style="width: 100%;">
                            <%#Container.DataItem%>
                        </td>
                    </tr>
                </ItemTemplate>

                <AlternatingItemTemplate>
                    <tr style="background-color: white; padding-top: 5px">
                        <td style="width: 100%;">
                            <%#Container.DataItem%>
                        </td>
                    </tr>
                </AlternatingItemTemplate>

                <FooterTemplate>
                    </table>
                </FooterTemplate>

            </asp:Repeater>
        </div>

【问题讨论】：

我猜请参阅“rowspan”和“colspan”属性。
您需要将全宽 100% 分配给 Table
@Deepak.Aggrawal - 非常感谢，这解决了问题

标签： c# html asp.net html-table repeater

【解决方案1】：

试试这个：

    <div style="overflow-y: auto; width: 100%; height: 395px; border: 0px solid #3C454F; background-color: #FFFBE6; border: 0px solid #3C454F;">
        <asp:Repeater ID="TestList" runat="server">
            <HeaderTemplate>
                <table style="width:100%;">
            </HeaderTemplate>

            <ItemTemplate>
                <tr style="background-color: aqua; padding-top: 5px">
                    <td style="width: 100%;">
                        <%#Container.DataItem%>
                    </td>
                </tr>
            </ItemTemplate>

            <AlternatingItemTemplate>
                <tr style="background-color: white; padding-top: 5px">
                    <td style="width: 100%;">
                        <%#Container.DataItem%>
                    </td>
                </tr>
            </AlternatingItemTemplate>

            <FooterTemplate>
                </table>
            </FooterTemplate>

        </asp:Repeater>
    </div>

【讨论】：