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?
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 </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 </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
</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
</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">
<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;">
<br />
</div>
</td>
</tr>
</table>
<table align="center" style="width:361px">
<tr>
<td style="align-content:flex-start" class="auto-style8">
<asp:CheckBox ID="ChbC" runat="server" Text="Creciendo" />
</td>
<td style="align-content:flex-start" class="auto-style8">
<asp:CheckBox ID="ChbFechaManual" runat="server" Text="Fecha Manual" />
</td>
</tr>
<tr>
<td style="align-content:flex-start">
<asp:CheckBox ID="ChbT" runat="server" Text="T" />
</td>
<td style="align-content:flex-start">
<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 .