css - 无法将asp.net表单元格放入网页中

设计问题。 ................................................... ................................................... ...

我正在努力正确放置“主要基线目标”表单元格。我尝试了各种样式，但没有帮助。提前致谢。

需要：


我的O / P：


CSS：

.labels {
    font-size: 9pt;
    font-weight: bold;
    font-family: Calibri;
}

HTML

<fieldset style="border: solid; border-width: thin; width: 95%; height: 200px; border-color: #a8a8a8; margin: auto;">
    <legend id="Legend14" runat="server" visible="true" style="width: auto; margin-bottom: 0px; font-size: 12px; font-weight: bold; color: #1f497d;">&nbsp;&nbsp; Project Performance &nbsp;&nbsp;</legend>
    <div style="margin-bottom: 10px; margin-left: 10px;">
        <asp:Table ID="table8" runat="server" CssClass="labels">
            <asp:TableRow>
                <asp:TableCell>
                    Critical to Quality (CTQ)  &nbsp;&nbsp;
                </asp:TableCell>
                <asp:TableCell>
                    <asp:TextBox runat="server" Width="590px" Height="23px" ></asp:TextBox>
                </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow>
                <asp:TableCell>
                    Baseline Performance  &nbsp;&nbsp;
                </asp:TableCell>
                <asp:TableCell>
                    <asp:TextBox runat="server" Width="590px" Height="23px" ></asp:TextBox>
                </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow>
                <asp:TableCell>
                    Primary Metric  &nbsp;&nbsp;
                </asp:TableCell>
                <asp:TableCell>
                    <asp:TextBox runat="server" Width="95px" Height="23px" ></asp:TextBox>
                </asp:TableCell>
                <asp:TableCell>
                    Primary Baseline Target  &nbsp;&nbsp;
                </asp:TableCell>
                <asp:TableCell>
                    <asp:TextBox runat="server" Width="95px" Height="23px" ></asp:TextBox>
                </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow>
                <asp:TableCell>
                    Secondary Metric  &nbsp;&nbsp;
                </asp:TableCell>
                <asp:TableCell>
                    <asp:TextBox runat="server" Width="590px" Height="23px" ></asp:TextBox>
                </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow>
                <asp:TableCell>
                    Target performance  &nbsp;&nbsp;
                </asp:TableCell>
                <asp:TableCell>
                    <asp:TextBox runat="server" Width="590px" Height="23px" ></asp:TextBox>
                </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow>
                <asp:TableCell>
                    Performance at Project Close  &nbsp;&nbsp;
                </asp:TableCell>
                <asp:TableCell>
                    <asp:TextBox runat="server" Width="590px" Height="23px" ></asp:TextBox>
                </asp:TableCell>
            </asp:TableRow>
        </asp:Table>
    </div>
</fieldset>

最佳答案

您需要跨行的列，而没有两个带有ColumnSpan的文本框。基本上，您需要4列，但仅在第3行和第4行中才需要这4列。在所有其他行上，您都不会使用它们，因此您将必须跨越第二列开始。

<asp:Table ID="table8" runat="server" CssClass="labels">
    <asp:TableRow>
        <asp:TableCell>
            Critical to Quality (CTQ)  &nbsp;&nbsp;
        </asp:TableCell>
        <asp:TableCell ColumnSpan="3">
            <asp:TextBox runat="server" Width="590px" Height="23px" ></asp:TextBox>
        </asp:TableCell>
    </asp:TableRow>
    <asp:TableRow>
        <asp:TableCell>
            Baseline Performance  &nbsp;&nbsp;
        </asp:TableCell>
        <asp:TableCell  ColumnSpan="3">
            <asp:TextBox runat="server" Width="590px" Height="23px" ></asp:TextBox>
        </asp:TableCell>
    </asp:TableRow>
    <asp:TableRow>
        <asp:TableCell>
            Primary Metric  &nbsp;&nbsp;
        </asp:TableCell>
        <asp:TableCell>
            <asp:TextBox runat="server" Width="95px" Height="23px" ></asp:TextBox>
        </asp:TableCell>
        <asp:TableCell>
            Primary Baseline Target  &nbsp;&nbsp;
        </asp:TableCell>
        <asp:TableCell>
            <asp:TextBox runat="server" Width="95px" Height="23px" ></asp:TextBox>
        </asp:TableCell>
    </asp:TableRow>
</asp:Table>