Foros del Web - Ver Mensaje Individual - Ayuda por favor..no sé que hacer con la página que hago.

Sayu · #1 (**permalink**) 23/07/2010, 10:18

Hola a todos
Tengo una situación que me está dando dolores de cabeza y no sé que hacer.
Llevo poco haciendo páginas, la verdad sé cosas básicas y he aprendido mucho de consejos que dan por aquí.

El punto es el siguiente, no sé porque razón en la laptop donde diseño la página, todo se ve bien, perfectamente acomodado. Pero en otras pc's se ve mal.
Lo más extraño es que en el mismo navegador (por ejemplo firefox) en la lap se ve bien y en la pc se ve mal. (suceso extraño)

Sólo en la laptop se ve bien, llevo los archivos a otra pc, le muevo ahi para comodarlo y si lo regreso a la lap, se ve mal...

No sé que peuda ser..tal vez tengo error en mis codigos, o lo hice mal...pero es extraño que en el mismo navegador se vea diferente, siendo el mismo contenido.

dejo aquí el codigo, esperando alguien pueda orientarme.

Código HTML:

<body>
<div id="contenedor">
   <div id="titulo"><img src="images/index_titulo.jpg" alt="Proyección personal y profesional"></img></div>
   <div id="imagen"><img src="images/index_imagen.png" alt="Profesional"></img></div>

   <div id="ingresar">
      <div id="campos">
        <p class="informacion">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Correo:</p>
        <p class="informacion">Contrase&ntilde;a:</p>
      </div>
      <form>
         <div id="nombre"><input type="text" name="correo" size=11 maxlength=60></div>
         <div id="contrasena"><input type="password" name="clave" size=11></div>
         <div id="boton"><a href="#" target="_self"><img src="images/btn_entrar.jpg" width=91 height=26 border=0 alt="Entrar"></a></div>
      </form>
      <div id="texto">
         <p class="informacion2"><span class="enlace"><a href="#" target="_self">¿Olvidaste tu contrase&ntilde;a?</a></span></p>
         <p class="informacion2">¿A&uacute;n no tienes una cuenta?.&nbsp;&nbsp;<span class="enlace"><a href="#" target="_self">Reg&iacute;strate aqu&iacute;</a></span></p>
      </div>
      <div id="cuadro"></div>
   </div> <!-- end of ingresar -->
</div> <!-- end of contenedor -->
</body>

Código:

BODY {
background: #FFFFFF url(../images/bg.jpg);
font : Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
margin: 0;
padding: 0;
text-align: center;
}

a:link {color: #000000; text-decoration: none; font-weight: bold;}
a:visited {color: #000000; text-decoration: none; font-weight: bold;}
a:active {color: #000000; text-decoration: underline;}
a:hover {color: #000000; text-decoration: underline;}


#titulo {
margin-top: 100px;
clear: both;
}

#imagen {
float: left;
margin-top: -2px;
clear: both;
}

#nombre {
float: left;
margin-top: -337px;
margin-left: 570px;
clear: both;
}

#contrasena {
float: left;
margin-top: -310px;
margin-left: 570px;
clear: both;
}

#campos {
margin-top: 10px;
margin-left: 11px;
position: relative;
left: -296px;
top: 65px;
line-height:100%;
}

#texto {
margin-top: 10px;
margin-left: 11px;
position: relative;
left: -203px;
top: 100px;
line-height:60%;
}

p.informacion {
font-weight: normal;
color: #000000;
font-family: Arial;
font-size: 12px;
}

p.informacion2 {
font-weight: normal;
color: #000000;
font-family: Arial;
font-size: 12px;
}

span.enlace {
font-weight: bold;
color: #000000;
font-family: Arial;
font-size: 12px;
}

#boton {
float: left;
margin-top: -325px;
margin-left: 680px;
clear: both;
}

#cuadro {
width: 342px;
height: 183px;
background: url(../images/index_cuadro.jpg) no-repeat;
margin-left: 460px;
margin-top: -58px;
}

La imagen de fondo, se ve mal tambien, quisiera poder encontrar la manera de que se adapte a toda la resolución de la pantalla.

Ojala me pueda ayudar
Gracias