需要与TD的

-1

边界对齐我有一个html为此，我想在其td's来排列border如图所示图片下方需要与TD的

我试过，但它不来了。

下面是HTML

<table bgcolor="#EAEFF5" cellpadding="3" cellspacing="3" width="100%"> 
    <tr> 
     <td style="vertical-align: top;"> 
      <table bgcolor="#EAEFF5" cellpadding="3" cellspacing="3" width="100%"> 
       <tr> 
        <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
         Aggregate Name: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtAggrName" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
         Confirming Party: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtConfirmParty" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <tr> 
         <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
          Agreement Amt Payable: 
         </td> 
         <td class="field2" style="text-align: left;"> 
          <asp:TextBox ID="txtAgreePay" runat="server" Width="95%"></asp:TextBox> 
         </td> 
        </tr> 
        <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 70%;"> 
         Land Aggregate Payable: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtLandPay" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
         Confirming Party: 
        </td> 
        <td style="text-align: left;"> 
         <asp:TextBox ID="TextBox1" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
         Total Land Value: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtTotLandValue" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
         Stamp Duty: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtStampDuty" runat="server" Width="95%"></asp:TextBox> 
        </td> 
        <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
        </td> 
        <td class="field2" style="text-align: left;"> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Registration Fees: 
        </td> 
        <td class="field" style="text-align: left;"> 
         <asp:TextBox ID="txtRegFees" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Legal Fees: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtLegFees" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Other Expenses: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtOthExp" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Total: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtTotal" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Grand Total: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <asp:TextBox ID="txtGrandTotal" runat="server" Width="95%"></asp:TextBox> 
        </td> 
       </tr> 
      </table> 
     </td> 
     <td style="vertical-align: top;"> 
      <table bgcolor="#EAEFF5" cellpadding="3" cellspacing="3" width="100%"> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Registration Date: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <input type="text1" style="width: 60%" /> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Registration No: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <input type="text" style="width: 60%" /> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         POA No: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <input type="text" style="width: 60%" /> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         POA Holder: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <input type="text" style="width: 60%" /> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Conveyance Deed Regist No: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <input type="text" style="width: 60%" /> 
        </td> 
       </tr> 
       <tr> 
        <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
         Conveyance Deed Regist Date: 
        </td> 
        <td class="field2" style="text-align: left;"> 
         <input type="text" style="width: 60%" /> 
        </td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
</table>

让我知道如何获取

来源

2016-08-23 BNN

任何downvote使用在你需要的列，这些CSS样式应与_comment_支持。它不适合我在IE – BNN

你需要做一个内嵌表在TD那么你可以申请边框它。

.red-border { 
 
    border: 1px solid red; 
 
}

<table bgcolor="#EAEFF5" cellpadding="3" cellspacing="3" width="100%"> 
 
    <tr> 
 
    <td style="vertical-align: top;"> 
 
     <table bgcolor="#EAEFF5" cellpadding="3" cellspacing="3" width="100%"> 
 
     <tr> 
 
      <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
 
      Aggregate Name: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <asp:TextBox ID="txtAggrName" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
 
      Confirming Party: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <asp:TextBox ID="txtConfirmParty" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td colspan="2" class="red-border"><!-- add table in this td --> 
 
      <table width="100%"> 
 
       <tr> 
 
       <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
 
        Agreement Amt Payable: 
 
       </td> 
 
       <td class="field2" style="text-align: left;"> 
 
        <input ID="txtAgreePay" Width="95%"> 
 
       </td> 
 
       </tr> 
 
       <tr> 
 
       <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 70%;"> 
 
        Land Aggregate Payable: 
 
       </td> 
 
       <td class="field2" style="text-align: left;"> 
 
        <input ID="txtLandPay" Width="95%"> 
 
       </td> 
 
       </tr> 
 
       <tr> 
 
       <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
 
        Confirming Party: 
 
       </td> 
 
       <td style="text-align: left;"> 
 
        <input ID="TextBox1" Width="95%"> 
 
       </td> 
 
       </tr> 
 
       <tr> 
 
       <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
 
        Total Land Value: 
 
       </td> 
 
       <td class="field2" style="text-align: left;"> 
 
        <input ID="txtTotLandValue" Width="95%"> 
 
       </td> 
 
       </tr> 
 
      </table> 
 
      </td> 
 
     </tr> 
 

 
     <tr> 
 
      <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
 
      Stamp Duty: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <asp:TextBox ID="txtStampDuty" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
      <td style="font-family: Courier New; text-align: left; font-size: 120%; width: 60%;"> 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Registration Fees: 
 
      </td> 
 
      <td class="field" style="text-align: left;"> 
 
      <asp:TextBox ID="txtRegFees" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Legal Fees: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <asp:TextBox ID="txtLegFees" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Other Expenses: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <asp:TextBox ID="txtOthExp" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Total: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <asp:TextBox ID="txtTotal" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Grand Total: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <asp:TextBox ID="txtGrandTotal" runat="server" Width="95%"></asp:TextBox> 
 
      </td> 
 
     </tr> 
 
     </table> 
 
    </td> 
 
    <td style="vertical-align: top;"> 
 
     <table bgcolor="#EAEFF5" cellpadding="3" cellspacing="3" width="100%"> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Registration Date: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <input type="text1" style="width: 60%" /> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Registration No: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <input type="text" style="width: 60%" /> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      POA No: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <input type="text" style="width: 60%" /> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      POA Holder: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <input type="text" style="width: 60%" /> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Conveyance Deed Regist No: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <input type="text" style="width: 60%" /> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <td class="label2" style="font-family: Courier New; text-align: left; font-size: 120%;"> 
 
      Conveyance Deed Regist Date: 
 
      </td> 
 
      <td class="field2" style="text-align: left;"> 
 
      <input type="text" style="width: 60%" /> 
 
      </td> 
 
     </tr> 
 
     </table> 
 
    </td> 
 
    </tr> 
 
</table>

来源

2016-08-23 09:32:37

谢谢罗汉，它正在工作。但文本框的排列受到干扰。看看http://i.stack.imgur.com/OLwOl.png – BNN

应用带有一些填充和/或边距的像素宽度的文本框宽度 –

我设法在某个级别取得成功。但是我们可以将距离相同的所有文本框对齐吗？如http://i.stack.imgur.com/YZTOb.png所示。这是我最新的小提琴https://jsfiddle.net/gmx6cfah/ – BNN

在TD类属性

table { 
    border-collapse: collapse; 
} 

.borderlft { 
    border-left: 1px solid #ff0000; 
} 

.borderrht { 
    border-right: 1px solid #ff0000; 
} 

.bordertop { 
    border-top: 1px solid #ff0000; 
} 

.borderbtm { 
    border-bottom: 1px solid #ff0000; 
}

来源

2016-08-23 09:39:49 Joyson

需要与TD的

回答

相关问题