aspのテキストボックスコントロールを右に整列する

Question

私のテキストボックスコントロールを右揃えにする際に問題があるようです。ファーストネーム、ミドルネーム&姓が左側にあるが、テキストボックスコントロールが

<div class="container"> 
    <div class="border row"> 
    <div class="border col-sm-4"> First Name: <asp:TextBox ID="First_NameTextBox" runat="server" Text='<%# Bind("First_Name") %>' /> 
    </div> 
    <div class="border col-sm-4"> Middle Name: <asp:TextBox ID="Middle_NameTextBox" runat="server" Text='<%# Bind("Middle_Name") %>' /> 
    </div> 
    <div class="border col-sm-4"> Last Name: <asp:TextBox ID="Last_NameTextBox" runat="server" Text='<%# Bind("Last_Name") %>' /> 
    </div> 
</div> 

本部クラスのボーダーCOL-SM-4（画面の33.33パーセント）以内に右側に位置しているので、私はそれをしたいです

.container { 
    padding-right: 15px; 
    padding-left: 15px; 
    margin-right: auto; 
    margin-left: auto; 
} 

これについての助けがあれば驚くべきことです。

Answer 1

以下

チェックはラップがlabelまたはspan内のテキスト

1. を変更し、テキストボックスがclear:both

borderあなたのCSSクラスに追加し、右

をfloatに左

スタイルをfloatにCSSを追加

.container span { 
 
    float: left; 
 
} 
 
.container input[type="text"] { 
 
    float: right 
 
} 
 
.border { 
 
    clear: both; 
 
}

<div class="container"> 
 
    <div class="border row"> 
 
    <div class="border col-sm-4"><span>First Name:</span> 
 
     <asp:TextBox ID="First_NameTextBox" runat="server" Text='<%# Bind("First_Name") %>' /> 
 
    </div> 
 
    <div class="border col-sm-4"><span>Middle Name:</span> 
 
     <asp:TextBox ID="Middle_NameTextBox" runat="server" Text='<%# Bind("Middle_Name") %>' /> 
 
    </div> 
 
    <div class="border col-sm-4"><span>Last Name:</span> 
 
     <asp:TextBox ID="Last_NameTextBox" runat="server" Text='<%# Bind("Last_Name") %>' /> 
 
    </div> 
 
    </div>