Aligning label and textbox on same line (left and right)

Question

I have an ASP.NET control. I want to align the textbox to the right and the label to the left.

I have this code so far:

        <td  colspan="2">


                <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>


        <div style="text-align: right">    
                <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
        </div>

        </td>

The textbox aligns to the right, but the label aligns to the left and on the line above. How can I fix this so that the label is on the left, the textbox on the right, and both on the same line?

Thanks

Answer 1

you can use style

   <td  colspan="2">
     <div style="float:left; width:80px"><asp:Label ID="Label6" runat="server" Text="Label"></asp:Label></div>

    <div style="float: right; width:100px">    
            <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
    </div>

     <div style="clear:both"></div>

    </td>

Answer 2

You should use CSS to align the textbox. The reason your code above does not work is because by default a div's width is the same as the container it's in, therefore in your example it is pushed below.

The following would work.

<td  colspan="2" class="cell">
                <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>        
                <asp:TextBox ID="TextBox3" runat="server" CssClass="righttextbox"></asp:TextBox>       
</td>

In your CSS file:

.cell
{
text-align:left;
}

.righttextbox
{
float:right;
}