Verán, llevo casi que toda la tarde intento centrar todos los elementos de mi página pero nada que lo consigo, coloco "align="center"" en el div, o con un CSS pero igual, cuando quito el style con el position:absolute y demás sí se centra pero quedan todas en el "top" de la página, alguien sabe qué puedo hacer? De verdad ya intenté de todo:
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Inicio - Sistema de registro de ingresos</title>
<meta name="generator" content="WYSIWYG Web Builder 9 - http://www.wysiwygwebbuilder.com">
<style type="text/css">
body
{
margin: 0;
padding: 0;
background-color: #E1E1E1;
color: #000000;
}
</style>
<style type="text/css">
a
{
color: #0000FF;
text-decoration: underline;
}
a:visited
{
color: #800080;
}
a:active
{
color: #FF0000;
}
a:hover
{
color: #0000FF;
text-decoration: underline;
}
</style>
<style type="text/css">
#wb_formulario
{
background-color: transparent;
border: 0px #000000 solid;
}
#cedula
{
border: 1px #A9A9A9 solid;
background-color: #FFFFFF;
color :#000000;
font-family: Arial;
font-size: 13px;
text-align: left;
vertical-align: middle;
}
#wb_Text1
{
background-color: transparent;
border: 0px #000000 solid;
padding: 0;
text-align: center;
margin-left: auto;
margin-top: auto;
}
#wb_Text1 div
{
text-align: left;
}
#wb_Text3
{
background-color: transparent;
border: 0px #000000 solid;
padding: 0;
text-align: left;
}
#wb_Text3 div
{
text-align: left;
}
#Line1
{
color: #A0A0A0;
background-color: #A0A0A0;
border-width: 0px;
}
#pass
{
border: 1px #A9A9A9 solid;
background-color: #FFFFFF;
color :#000000;
font-family: Arial;
font-size: 13px;
text-align: left;
vertical-align: middle;
}
#enviar
{
border: 1px #A9A9A9 solid;
background-color: #F0F0F0;
color: #000000;
font-family: Arial;
font-size: 13px;
}
#Line2
{
color: #A0A0A0;
background-color: #A0A0A0;
border-width: 0px;
}
#wb_Text2
{
background-color: transparent;
border: 0px #000000 solid;
padding: 0;
text-align: left;
}
#wb_Text2 div
{
text-align: left;
}
</style>
</head>
<body>
<div id="wb_cajaform" style="position:absolute;left:382px;top:143px;width:348px;height:299px;z-index:3;">
<img src="images/img0001.png" id="cajaform" alt="" style="border-width:0;width:348px;height:299px;"></div>
<div id="wb_formulario" style="position:absolute;left:440px;top:223px;width:244px;height:156px;z-index:4;">
<form name="Form1" method="post" action="./verificar.php" enctype="text/plain" id="formulario">
<input type="number" id="cedula" style="position:absolute;left:36px;top:25px;width:167px;height:18px;line-height:18px;z-index:0;" name="cedula" value="" maxlength="8" placeholder="Cédula de identidad">
<input type="text" id="pass" style="position:absolute;left:36px;top:67px;width:167px;height:18px;line-height:18px;z-index:1;" name="pass" value="" maxlength="18" placeholder="Contraseña">
<input type="submit" id="enviar" name="" value="Ingresar" style="position:absolute;left:69px;top:108px;width:96px;height:25px;z-index:2;">
</form>
</div>
<div align="center" id="wb_Text1" style=" top: 23px; z-index: 5; text-align: center;">
<span style="color:#696969;font-family:Arial;font-size:37px;">Sistema de registro de ingresos</span></div>
<div id="wb_Text3" style="position:absolute;left:459px;top:157px;width:215px;height:27px;z-index:6;text-align:left;">
<span style="color:#696969;font-family:Arial;font-size:24px;">Ingresar al sistema</span></div>
<hr id="Line1" style="margin:0;padding:0;position:absolute;left:399px;top:198px;width:308px;height:1px;z-index:7;">
<hr id="Line2" style="margin:0;padding:0;position:absolute;left:400px;top:392px;width:308px;height:1px;z-index:8;">
<div id="wb_Text2" style="position:absolute;left:444px;top:408px;width:234px;height:16px;z-index:9;text-align:left;">
<span style="color:#000000;font-family:Arial;font-size:13px;"><a href="./registrar.php">¿No estás registrado? - Regístrate aquí</a></span></div>
</body>
</html>
Ayuda por favor, saludos.