align asp textbox control to the right - html

Question

I seem to have a problem aligning my textbox control to the right. I want it so First Name, Middle Name & Last Name are on the left but the textbox control is positioned on the right within the Div class border col-sm-4 (33.33% of the screen)
<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>
.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
any help with this would be amazing.

Answer 1

Check below changes
Wrap the text in a label or span and add CSS to float left
Style the textboxes to float right
Add clear:both to your CSS class border
.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>