Position controls in ASP.NET

0

I have tried several ways to position the controls in WebForms and none of them has worked for me. I tried through html and then with cells and everything goes out of order when opening the page with the browser.

How can I solve it?

    
asked by Javier 31.10.2016 в 05:28
source

1 answer

1

The best way to position any web element on a page is with the use of CSS3 . However, (although it is no longer recommended), you can also enter within the cells of the table and then set the table border to 0 , as in the following example:

 <table BORDER=0 align="center">

<tr>
<td class="auto-style1"align="LEFT">
    Numero de Personal</td> 

<td class="auto-style4">
    <asp:TextBox ID="TxtNumeroPersonal" runat="server" Columns="7" TextMode="MultiLine" Width="128px" Height="36px"></asp:TextBox>
    </td>
</tr>

<tr>
<td class="auto-style1"align="LEFT">
    Ejercicio&nbsp;</td>
<td class="auto-style4">
    <asp:TextBox ID="TxtEjercicio" runat="server" Height="22px" Width="128px"></asp:TextBox>
</td>
</tr>

        <tr>
<td class="auto-style1"align="LEFT">
    Parametro&nbsp;&nbsp;</td>
<td class="auto-style4">
    <asp:TextBox ID="TxtParametro" runat="server" Height="22px" Width="128px"></asp:TextBox>
</td>
</tr>

        <tr>
<td class="auto-style1"align="LEFT">
    Proceso&nbsp;&nbsp;&nbsp;
</td>
<td class="auto-style4">
    <asp:TextBox ID="TxtProceso" runat="server" Height="22px" Width="128px"></asp:TextBox>
</td>
</tr>
               <tr>
<td class="auto-style1"align="LEFT">
    Dia&nbsp;&nbsp;&nbsp;
</td>
<td class="auto-style4">
    <asp:TextBox ID="Txtdia" runat="server" Height="22px" Width="128px"></asp:TextBox>
</td>
</tr>
               <tr>
<td class="auto-style1"align="LEFT">
    Mes</td>
<td class="auto-style4">
    <asp:DropDownList ID="DDListMes" runat="server" Height="30px" Width="128px">
        <asp:ListItem Selected="true">Seleccione Mes</asp:ListItem>
        <asp:ListItem>Enero</asp:ListItem>
        <asp:ListItem>Febrero</asp:ListItem>
        <asp:ListItem>Marzo</asp:ListItem>
        <asp:ListItem>Abril</asp:ListItem>
        <asp:ListItem>Mayo</asp:ListItem>
        <asp:ListItem>Junio</asp:ListItem>
        <asp:ListItem>Julio</asp:ListItem>
        <asp:ListItem>Agosto</asp:ListItem>
        <asp:ListItem>Septiembre</asp:ListItem>
        <asp:ListItem>Octubre</asp:ListItem>
        <asp:ListItem>Noviembre</asp:ListItem>
        <asp:ListItem>Diciembre</asp:ListItem>
    </asp:DropDownList>
</td>
</tr>
               <tr>
<td class="auto-style1"align="LEFT">
    Año</td>
<td class="auto-style4">
    <asp:DropDownList ID="DDListAnio" runat="server" Height="30px" Width="128px">
        <asp:ListItem Selected="true">Seleccione Año</asp:ListItem>
        <asp:ListItem>2012</asp:ListItem>
        <asp:ListItem>2013</asp:ListItem>
        <asp:ListItem>2014</asp:ListItem>
        <asp:ListItem>2015</asp:ListItem>
        <asp:ListItem>2016</asp:ListItem>
    </asp:DropDownList>
</td>
                   </td>
</tr>
        </table>

     <table BORDER = 0 align = "center" style="width: 280px">
               <td class="auto-style7"align="left"> 
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
              <asp:RadioButtonList ID="RbList1" runat="server" Height="55px" Width="360px" RepeatColumns="2" style="margin-bottom: 0px" CellPadding="1" CellSpacing="1">
                    <asp:ListItem Selected="true" Value="0">Todas las Cartas</asp:ListItem>
                    <asp:ListItem Value="1">Carta 1</asp:ListItem>
                    <asp:ListItem Value="2">Carta 2</asp:ListItem>
                    <asp:ListItem Value="3">Carta 3</asp:ListItem>
                    <asp:ListItem Value="4">Carta 4</asp:ListItem>
                </asp:RadioButtonList>
                    </td>
          <tr>
                    <td>
                        <div style="text-align: center;">
                        &nbsp;<br />
                        </div>
                        </td>
                    </tr>       
                </table>

    <table align="center" style="width:361px">
        <tr>
            <td style="align-content:flex-start" class="auto-style8"> 
                &nbsp;
                <asp:CheckBox ID="ChbC" runat="server" Text="Creciendo" />
            </td>
            <td style="align-content:flex-start" class="auto-style8">
                 &nbsp;
                <asp:CheckBox ID="ChbFechaManual" runat="server" Text="Fecha Manual" />
            </td>
        </tr>
        <tr>
            <td style="align-content:flex-start">
                &nbsp;
                <asp:CheckBox ID="ChbT" runat="server"  Text="T" />
            </td>
            <td style="align-content:flex-start">
                &nbsp;
                <asp:CheckBox ID="ChBFiniquitos" runat="server" Text="Finiquitos Simulados" />
            </td>
        </tr>
    </table>

This will give you a result similar to the following image, although it should be mentioned that other styles are applied in CSS .

    
answered by 31.10.2016 в 05:49