Centrado formulario html

Tengo una pequeña aplicación que deseo se centre en la pantalla. Actualmente cuando la ejecuto (tiene 8 formularios) aparecen cada uno en posición diferente de la pantalla. O el menu abajo y las tablas arriba o la derecha y así.. Eso es un desorden. Intente con css pero me organiza uno los otros siguen igual o peor. No se si cada formulario tiene estilos diferentes y por eso no los posiciona. No se si habrá alguna forma de reiniciar todo y aplicar los estilo o posiciones nuevas. El lenguaje es Visual basic 2008 pero trabajo sobre el HTML.

2 Respuestas

Respuesta
1
Para que esté centrado, metelo dentro de un DIV y indícale:
margin: 0 auto;
Hola..
Gracias por la pronta respuesta. Mi pregunta es, ¿Esto lo hago en css o solo ingreso dentro del div lo que ue voy a centrar y sobre la etiqueta le doy el parámetro que me estas diciendo?
Otra pregunta, ¿No predomina el estilo que tiene el formulario sobre las tablas y que por eso no aplica los nuevos parámetros?
Me disculpas si las preguntas son necias pero no tengo muy buenos conocimiento sobre el tema. Mil gracias...
Lo puedes poner como style dentro del DIV o como una clase y aplicar un CSS.
Predomina siempre el nivel superior, pero depende de donde afecte... en blog. Ayzweb.com puedes encontrar un tutorial de una tienda online donde explica muchas cosas de CSS
No hay preguntas necias hombre!
Respuesta
Lo ideal para poderte ayudar mejor sería que me pasaras el código. No obstante te trataré de indicar de forma general, si ves que no te funciona, me pasas el código.
Mi idea es ponerle un DIV por cada elemento que quieras que se muestra en una misma fila. Me imagino que quieras que el menú este arriba en una fila primero, luego abajo el Formulario 1, más abajo el Formulario 2 y así. Lo más organizado es no poner los estilos directamente dentro del código, si no llamar a una clase del css, pero para el ejemplo te pondré todo en el mismo código.
En ese caso el código que te aconsejo que pruebes es:
<div style="width: 100%; float: left; clear: both; display: block;">
    CÓDIGO DEL MENÚ
</div>
<div style="width: 100%; float: left; clear: both; display: block;">
  CÓDIGO FORMULARIO 1
</div>
<div style="width: 100%; float: left; clear: both; display: block;">
  CÓDIGO FORMULARIO 1
</div>
.
.
.
Cualquier duda me dices.
Hola.
Gracias por la pronta respuesta!
Te pregunto, lo que pasa es que cuando cree unas tablas de varios formularios le di unos estilos que a al final fueron en vano porque no se acomodan como yo quiero. La pregunta es, A pesar de los estilos que ya tiene, ¿se le pueden aplicar otros desde css y los toma?
Lo digo porque ya lo hice y no funciono, en unos los dejaba muy a la izquierda, otros muy abajo, otros muy arriba y eso que tenían una sola indicación desde el css..
Mil gracias...
¿Has podido probar lo que te dije? En caso de que lo probaste y no te funcionara, ¿me podrías pasar la dirección donde tienes la página y así poder ver qué es lo que está pasando?
Hola...
Gracias por tu pronta respuesta respuesta. Mira seria bueno que ingresaras a mi PC por medio del teamviewer para que lo revises y digas si me estoy ahogando en una vaso con agua.. je je.. Claro si puedes y tienes tiempo, es que la verdad me estoy quebrando la cabeza con ese tema y tengo unos que son más complicados.
Mil gracias, saludos.
Lo siento muchísimo pero apenas puedo sacar tiempo para ayudar en lo que puedo aquí en TodoExpertos. Si me pasaras el código yo lo puedo ver o enviárselo a uno de mis programadores, pues realmente quisiera poder ayudarte.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Archivo.aspx.vb" Inherits="proyecto.Archivo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Soft_review</title>
<style type="text/css">
        #form1
        {
            width: 1207px;
            height: 592px;
            top: -36px;
            left: -363px;
            position: absolute;
            margin-left: 100px;
        }
        .style3
        {
            width: 40%;
            border: 2px solid #0000ff;
            background-color: #c0c0c0;
            margin-left: 264px;
            height: 10px;
        }
        .style2
        {
            width: 40%;
            margin-left: 203px;
        }
        .style4
        {
            width: 169px;
        }
    </style>
</head>
<body>
<form id="form1" runat="server">
<p style="color: #000000; height: 6px;"> </p>
<p style="color: #000000; height: 6px;"> </p>
<p style="color: #000000; height: 6px;"> </p>
<p style="color: #000000; height: 6px;"> </p>
<p style="color: #000000; height: 6px;">
<div style="width: 100%; float: left; clear: both; display: block;"> 
<table border="2" class="style2" frame="vsides"
            style="font-family: Georgia; border-style: inset; border-width: medium; position: absolute; top: 38px; left: 46px;">
<tr>
<td>
                    <asp:Menu ID="Menu2" runat="server" BackColor="White" Height="19px"
                        BorderWidth="2px" ForeColor="#990033" Orientation="Horizontal">
                        <Items>
                            <asp:MenuItem Text="Creación" Value="Creación">
                                <asp:MenuItem NavigateUrl="~/CrearDestinatario.aspx" Text="Destinatario"
                                    Value="Destinatario"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/Mensajero.aspx" Text="Mensajero" Value="Mensajero">
                                </asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/Producto.aspx" Text="Producto" Value="Producto">
                                </asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/Archivo.aspx" Text="Archivo" Value="Archivo">
                                </asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/CrearSupervisor.aspx" Text="Supervisor"
                                    Value="Supervisor"></asp:MenuItem>
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>
                    </td>
<td>
                    <asp:Menu ID="Menu3" runat="server" BackColor="White" BorderWidth="2px"
                        ForeColor="#990033" Orientation="Horizontal">
                        <Items>
                            <asp:MenuItem Text="Procesos Generales" Value="Creación">
                                <asp:MenuItem NavigateUrl="~/asignacion.aspx" Text="Asignacion"
                                    Value="Destinatario"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/descargue.aspx" Text="Descargue" Value="Mensajero">
                                </asp:MenuItem>
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>
                    </td>
<td>
                    <asp:Menu ID="Menu4" runat="server" BorderWidth="2px" ForeColor="#990033"
                        Orientation="Horizontal">
                        <Items>
                            <asp:MenuItem Text="Consultas" Value="Creación"
                                NavigateUrl="~/consupervisor.aspx">
                                <asp:MenuItem NavigateUrl="~/ConDestinatario.aspx" Text="Destinatario"
                                    Value="Destinatario"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/ConMensajero.aspx" Text="Mensajero"
                                    Value="Mensajero"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/ConProducto.aspx" Text="Producto" Value="Producto">
                                </asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/consupervisor.aspx" Text="Supervisor"
                                    Value="Supervisor"></asp:MenuItem>
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>
                    </td>
<td class="style4">
                    <asp:Menu ID="Menu5" runat="server" BorderWidth="2px" ForeColor="#990033"
                        Orientation="Horizontal">
                        <Items>
                            <asp:MenuItem Text="Eliminar registros" Value="Creación">
                                <asp:MenuItem NavigateUrl="~/EliDestinatario.aspx" Text="Destinatario"
                                    Value="Destinatario"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/EliMensajero.aspx" Text="Mensajero"
                                    Value="Mensajero"></asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/EliProducto.aspx" Text="Producto" Value="Producto">
                                </asp:MenuItem>
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>
                    </td>
<td class="style4">
                    <asp:Menu ID="Menu6" runat="server" BorderWidth="2px" ForeColor="#990033"
                        Orientation="Horizontal">
                        <Items>
                            <asp:MenuItem Text="Crear Contraseña" Value="Crear Contraseña">
                                <asp:MenuItem NavigateUrl="~/Seguridad.aspx"
                                    Text="Contraseña Supervisor" Value="Contraseña Supervisor"></asp:MenuItem>
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>
                    </td>
</tr>
</table>
</div>
</p>
<p style="color: #000000; height: 6px;"> </p>
<br />
        <br />
        <br />
        <br />
<p style="color: #000000; height: 6px;">
<p style="color: #000000; height: 6px;">
<table class="style3">
<tr>
<td>
                    <asp:Button ID="btnCopiar" runat="server" Text="Copiar archivo" />
                </td>
<td>
                    </td>
</tr>
<tr>
<td>
                    <asp:FileUpload ID="FileUpload1" runat="server" />
                </td>
<td>
                    </td>
</tr>
</table>
<p style="color: #000000; height: 6px;">
<p style="color: #000000; height: 6px;">
        <br />
        <br />
        <br />
<p>
            </p>
<p>
            </p>
<p>
        </p>
</form>
<p>
        </p>
<p>
        </p>
<p>
    </p>
<p>
        </p>
<p>
        </p>
<p>
        </p>
<p>
    </p>
<p>
        </p>
<p>
    </p>
<p>
        </p>
</div>
</body>
</html>
No me queda muy claro el código.. Por lo que veo, ¿hay ahí un solo formulario?
¿El menú te sale como quieres que te salga? Es que veo que en los estilos cada opción del menú tiene un tamaño distinto a la otra, pero no sé si es intencional.
Este div que has puesto
<div style="width: 100%; float: left; clear: both; display: block;"> debes ponerlo antes de <form id="form1" runat="server"> y cerrarlo después de cerrar el form.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas