Foros del Web » Creando para Internet » CSS »

Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas

Estas en el tema de Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas en el foro de CSS en Foros del Web. Holas, Pues, quisiera que me echen una mano con un problema que tengo, primeramente quiero comentarles que me he leido bastantes manuales de posicionamiento y ...
  #1 (permalink)  
Antiguo 04/10/2006, 12:54
Avatar de Celcius  
Fecha de Ingreso: febrero-2003
Ubicación: Lima - Perú
Mensajes: 652
Antigüedad: 14 años, 9 meses
Puntos: 5
Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas

Holas,
Pues, quisiera que me echen una mano con un problema que tengo, primeramente quiero comentarles que me he leido bastantes manuales de posicionamiento y como que no lo entiendo muy bien pues yo siempre he estado haciendo pagianas con tablas ...

Lo que pasa es que este codigo se ve como yo quiero en internet explorer, pero en Firefox se ve totalmente distinto...
Código:
<!doctype html public "-//W3C//DTD HTML 4.01//EN">

<html>

   <head>
      <title>Ricky Blog</title>
      <link rel="stylesheet" type="text/css" href="estilos.css">
      <meta http-equiv="generator" content="PHP Designer 2005" />
   </head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
<div id="container">
    <div id="encabezado">
        <div id="izquierda"></div>
        <div id="derecha"></div>
        <div id="centro"></div>
    </div>
    <div id="frase"></div>
    <div id="cuerpo"></div>
    <div id="pie"></div>
</div>
</body>
</html>
y los estilos:

Código:
body {
  background-color: #FFFFFF;
  text-align:center;
  font: #000000 verdana, tahoma, arial;
  margin:0px;
}
#container {
  width: 780px;
  text-align:left;
  background-color:#F7F7F7;
  margin:auto;
}
#encabezado {
  background:white;
  width:780px;
  height:283px;
  margin:0px;
}
    #izquierda {
      width:257px;
      height:283px;
      background:url("images/lizquierdo.jpg") no-repeat;
      float:left;
    }
    #derecha {
      width:189px;
      height:283px;
      background:url("images/lderecho.jpg") no-repeat;
      float:right;
    }
    #centro {
      position:absolute;
      margin: 50px 0 0 20px;
      width:334px;
      height:283px;
      background:url("images/bautizo.jpg") no-repeat;
      float:center;
    }
Estoy seguro que ustedes saben que tengo que hacer para solucionarlo, pueden bajarse las imagenes que estoy usando desde http://rickyblog.pandela.net/pruebas/images.zip .

Vale aclarar que estoy aprendiendo y hago estas pruebas pues forman parte de mi aprendizaje... muchas gracias por tu valioso tiempo.
__________________
"Si tú conocieras el don de Dios, y quién es el que te dice: 'Dame de beber,' tú Le habrías pedido a El, y El te hubiera dado agua viva.
Sn. Juan 4:19
Jesus
  #2 (permalink)  
Antiguo 04/10/2006, 16:10
Avatar de Celcius  
Fecha de Ingreso: febrero-2003
Ubicación: Lima - Perú
Mensajes: 652
Antigüedad: 14 años, 9 meses
Puntos: 5
Nadie?

Aqui les paso mi cabecera en Internet Explorer:




y aqui en Firefox:



Si se dan cuenta, la imagen del bautizo se sobrepone al nombre del Blog (En firefox). Seguro que si saben, por favor, denme una mano que estoy bien perdido...

saludos...
__________________
"Si tú conocieras el don de Dios, y quién es el que te dice: 'Dame de beber,' tú Le habrías pedido a El, y El te hubiera dado agua viva.
Sn. Juan 4:19
Jesus
  #3 (permalink)  
Antiguo 19/03/2008, 18:36
Avatar de renaco  
Fecha de Ingreso: mayo-2005
Ubicación: Lima, Peru, Peru
Mensajes: 3
Antigüedad: 12 años, 7 meses
Puntos: 0
Re: Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas

Hola, vi tu codigo, lo que pasa es que al momento de crear los estilos deben ser para clases osea debes cambiar los #clase por .clase y tambien debes fijar la posición de los divs (top y left) dependiendo de la ubicación de tus capas, por esa razón no esta ordenado en fireworks, en mi caso yo cuando desarrollo capas en firewors sale mejor que en internet.

Saludos

Renan Romero
www.romeroruiz.com
  #4 (permalink)  
Antiguo 19/03/2008, 19:30
Avatar de masterpuppet
Software Craftsman
 
Fecha de Ingreso: enero-2008
Ubicación: Montevideo, Uruguay
Mensajes: 3.550
Antigüedad: 9 años, 10 meses
Puntos: 845
Re: Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas

el problema esta en el #centro

#centro {
position:absolute;
margin: 50px 0 0 20px;
width:334px;
height:283px;
background:url("images/bautizo.jpg") no-repeat;
float:center;
}

en realidad ff esta renderizandolo bien el q hace cualquiera como siempre es el innombrable . float center no existe , es right o left.
proba con esto:

#centro {
width:334px;
height:283px;
background:url("images/bautizo.jpg") no-repeat;
float:left;
}

salu2
  #5 (permalink)  
Antiguo 20/03/2008, 17:00
 
Fecha de Ingreso: marzo-2008
Mensajes: 10
Antigüedad: 9 años, 8 meses
Puntos: 0
Re: Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas

Agregale esto a tu encabezado para que sea mas compatible entre ambos

<!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">
  #6 (permalink)  
Antiguo 21/03/2008, 23:08
 
Fecha de Ingreso: marzo-2008
Ubicación: En casa
Mensajes: 252
Antigüedad: 9 años, 8 meses
Puntos: 4
Re: Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas

Por comentar esto no es la solucion pero es una referencia para que tengas encuenta en el futuro, Firefox respeta los estandares de diseño web miestras que el internet explorer se los salta asi que yo que tu lo tendria encuenta tanto para buscar errores como para revisar tu web.
  #7 (permalink)  
Antiguo 28/03/2011, 05:21
 
Fecha de Ingreso: marzo-2011
Mensajes: 1
Antigüedad: 6 años, 8 meses
Puntos: 0
De acuerdo Respuesta: Problemas. Diferencias entre IE y Firefox en Posicionamiento de Capas

Gracias Pegasomx, has salvado mi culo.

Última edición por 7koan; 28/03/2011 a las 05:21 Razón: nick de otro usuario mal escrito (por mi previsamente)
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 2 personas (incluyéndote)




La zona horaria es GMT -6. Ahora son las 14:35.