Question

我想将HTML table部分复制到表单的右侧。但是，当我添加td's时，它会被签署。

这是我的HTML

<table cellpadding="0" cellspacing="0" width="100%">
    <tr style="width: 50%">
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Aggregate Name:
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtAggrName" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Confirm Party:
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtConfirmParty1" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Agreement Amt Payable
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtAgreAmtPay" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Land Agrregate Payable
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtlandAggPay" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Confirm Party
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtConfirmParty2" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Total Land Value
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtLandValue" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Stamp Duty
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtStampDuty" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Registration Fees
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtRegisFees" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Legal Fees
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtLegalFees" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Other Expenses
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtOthExp" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Total =
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtTotal" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td class="label" style="font-family: Courier New; width: 10%; text-align: left;
            font-size: 120%;">
            Grand Total =
        </td>
        <td class="field" style="text-align: left;">
            <asp:TextBox ID="txtGrandTotal" runat="server" Width="20%"></asp:TextBox>
        </td>
    </tr>
</table>

下面是截图

Answer 1

在这里，我为您想要的结构创建了一个JSFiddle。
根据您的要求，为了获得更好的视图和有效的 HTML ，您需要遵循 DOM ：

bind

Answer 2

将整个表格放入带ID的div中，并将其宽度调整为50％，然后通过CSS标记将div移动到右侧：这是一个例子：

    table-right{
width: 500px;
margin-left: 400px;
}

HTML没有在表的右侧对齐

2 个答案: