Foros del Web » Creando para Internet » CSS »

Posicionamiento de capas

Estas en el tema de Posicionamiento de capas en el foro de CSS en Foros del Web. Fijaros en las dos capas que simulan dos post-it en la siguiente dirección: http://www.futurosprofes.com/pruebas/index.html En Firefox y Opera no tengo problemas para verla correctamente, pero ...
  #1 (permalink)  
Antiguo 21/02/2007, 06:18
 
Fecha de Ingreso: mayo-2006
Mensajes: 124
Antigüedad: 11 años, 6 meses
Puntos: 0
Exclamación Posicionamiento de capas

Fijaros en las dos capas que simulan dos post-it en la siguiente dirección:

http://www.futurosprofes.com/pruebas/index.html

En Firefox y Opera no tengo problemas para verla correctamente, pero en IE6 el postit de la derecha se me desvia bastante hasta la derecha. No entiendo por qué me hace esto, ya que usé el mismo código que para esta otra página:

http://www.futurosprofes.com/pruebas/meca.html

Como veis en esta última las capas primeva y segeva se ven igual posicionadas en todos los navegadores, entonces si uso el mismo código para la página anterior de los post-it, no entiendo por que el explorer me descoloca el postit de la derecha. Echarme una mano please.
  #2 (permalink)  
Antiguo 21/02/2007, 06:50
Avatar de mbavio  
Fecha de Ingreso: agosto-2005
Mensajes: 288
Antigüedad: 12 años, 3 meses
Puntos: 4
Re: Posicionamiento de capas

Yo creo que IE esta entendiendo mal el margen de #postit2.
Por que no pruebas de flotar tambien #posit2 a la derecha y que el margen entre ellos se realize automaticamente?
Saludos.
  #3 (permalink)  
Antiguo 21/02/2007, 08:14
 
Fecha de Ingreso: mayo-2006
Mensajes: 124
Antigüedad: 11 años, 6 meses
Puntos: 0
Re: Posicionamiento de capas

Probaré como dices. Solo una cosa, cuando dices que el margen entre los postit se realice automaticamente, te refieres a que al #postit2 le ponga por la derecha el mismo margen que le pongo al #postit1 por la izquierda, o a que use alguna propiedad en el css que haga esto automaticamente. Gracias.
  #4 (permalink)  
Antiguo 21/02/2007, 10:30
Avatar de mbavio  
Fecha de Ingreso: agosto-2005
Mensajes: 288
Antigüedad: 12 años, 3 meses
Puntos: 4
Re: Posicionamiento de capas

Nono a la que me refiero es que flotes cada uno a su lado, y que no pongas ningun margen. Obviamente que tendrás que poner un tamaño a la capa contenedora de estos dos divs. Asi, el margen será automático.
  #5 (permalink)  
Antiguo 21/02/2007, 13:20
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Posicionamiento de capas

Yo creo que es el mismo problema de la otra vez, de explorer y sus problemas con los márgenes. Puedes probar a cambiar el margin-left: 300px; por left: 300px; del postit2, a ver qué pasa.

Mikel.
  #6 (permalink)  
Antiguo 21/02/2007, 14:59
 
Fecha de Ingreso: mayo-2006
Mensajes: 124
Antigüedad: 11 años, 6 meses
Puntos: 0
Re: Posicionamiento de capas

Supongo que será eso, aunque ya lo solucioné flotando cada capa a un lado, como indicaba mvabio. Lo que realmente me descoloca es como de las dos páginas que puse, en una colocaba bien las cajas, y en otra no, cuando las propiedades que tenian las cajas en las hojas de estilo eran exactamente las mismas.

Por cierto, podriais recomendarme un buen libro sobre CSS? , de los que he mirado en tiendas online este es el que más me llama:

http://www.fnac.es/dsp/?servlet=exte...&prodID=624548
  #7 (permalink)  
Antiguo 21/02/2007, 17:05
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Posicionamiento de capas

Bueno, es que en realidad creo que las clases no son iguales:

#primeva {
width: 210px;
float: left;
margin-top: 30px;
position: relative;
left: 55px;
}
#postit {
background-image: url(postit.png);
width: 244px;
float:left;
margin-top: 30px;
position: relative;
left: 35px;
height: 200px;

}

#segeva {
width: 210px;
margin-top: 30px;
margin-left: 320px;
}
#postit2 {
background-image: url(postit.png);
width: 244px;
margin-top: 30px;
margin-left: 300px;
height: 200px;
}

Esas pequeñas diferencias son muy importantes.

Yo lo más práctico que he encontrado ha sido esto:

http://www.sidar.org/recur/desdi/tra...css/intro.html

La traducción de las norma css2, pero bueno, yo soy un poco raro.

Mikel.
  #8 (permalink)  
Antiguo 21/02/2007, 22:58
 
Fecha de Ingreso: mayo-2006
Mensajes: 124
Antigüedad: 11 años, 6 meses
Puntos: 0
Re: Posicionamiento de capas

Gracias de nuevo Mikel, la verdad que no pensaba que por definir un alto a la capa, darle un ancho diferente al width o valores diferentes a propiedades como el left y margin-left cambiara el comportamiento. Estoy dando mis primeros pasos y la verdad que esto del css es un invento, pero me da miedo cada vez que tengo que comprobar mi página en el Internet Explorer, estoy pillando un trauma con este navegador.
  #9 (permalink)  
Antiguo 22/02/2007, 01:11
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Posicionamiento de capas

Ya, a mi también me jode cantidad, como a todo el mundo. La verdad es que con las tablas las diferencias son mucho menores, pero a veces casi insalvables también.

Y encima sacan el IE7 (que es horrible, para mi, en todos los aspectos), y no han corregido casi nada. Pone por alguna parte que tiene un 56% de compatibilidad con css2 .

Desgraciadamente en los proyectos profesionales no hay más remedio que tenerlo muy en cuenta. En los personales, llegará un día que pondremos en el pie de la web: "¿usas explorer y ves mal esta página? Será porque quieres. Que te den".

Mikel.
  #10 (permalink)  
Antiguo 22/02/2007, 06:55
Avatar de mbavio  
Fecha de Ingreso: agosto-2005
Mensajes: 288
Antigüedad: 12 años, 3 meses
Puntos: 4
Re: Posicionamiento de capas

Muerte al *** explorer!!!!

falonpla, existen muy buenos libros de CSS, CSS Mastery de Andy Budd ha sido el mejor que he leido. Asi todo, en la web existen muy buenos tutoriales y si sabes buscar, puedes reemplazar perfectamente un libro con la web. Saludos.
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




La zona horaria es GMT -6. Ahora son las 20:16.