Aligning the label and text field on the same line (left and right)

I have an ASP.NET control. I want to align the text box on the right and the label on the left.

I have this code:

        <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 text box is aligned to the right, but the label is aligned to the left and in the line above. How can I fix this so that the label is on the left, the text box is on the right and both are on the same line?

thank

+3
source share
3 answers

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>
+11
source

You must use CSS to align the text box. The reason your code above does not work is because by default the width of the div is the same as in the container, so in your example it is clicked below.

.

<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>

CSS:

.cell
{
text-align:left;
}

.righttextbox
{
float:right;
}
+1

, :

<table width="100%">
  <tr>
    <td style="width: 50%">Left Text</td>
    <td style="width: 50%; text-align: right;">Right Text</td>
  </tr>
</table>

Or you can do it using CSS as follows:

<div style="float: left;">
    Left text
</div>
<div style="float: right;">
    Right text
</div>
0
source

Source: https://habr.com/ru/post/1745950/


All Articles