Foros del Web » Creando para Internet » CSS »

Problema Div y Margen en IE!

Estas en el tema de Problema Div y Margen en IE! en el foro de CSS en Foros del Web. Bueno, no se si ya han preguntado esto, pero no se como buscarlo. EL problema que tengo es con IE, resulta que tengo un DIV ...
  #1 (permalink)  
Antiguo 05/09/2009, 17:21
 
Fecha de Ingreso: febrero-2009
Mensajes: 16
Antigüedad: 8 años, 10 meses
Puntos: 0
Problema Div y Margen en IE!

Bueno, no se si ya han preguntado esto, pero no se como buscarlo.

EL problema que tengo es con IE, resulta que tengo un DIV flotante hacia la izquierda, dentro de el div HEAD, y luego un DIV con un banner, de esta manera!

Código HTML:
<div id"head">
	<div style="float:left">
		Contenido y Fondo
	</div>
</div>

<div id="banner">
Banner + fondo
</div> 
Resulta que el div flotante lo tengo ligeramente traspasando el borde del head, para que el fondo de este se olculte detras del fondo del banner.

Pero resulta que en IE, el DIV flotante no se oculta detrás del div banner, si no que mueve el div banner hacia abajo

Esto solo sucede en IE, en FX y Chorme no me pasa :S

Como puedo arreglarlo para IE?!

Proyecto: facciasas.com
El problema esta en el form_login (Modulo de sección ) y el h_area (header banner)

Última edición por Masterock; 05/09/2009 a las 19:59
  #2 (permalink)  
Antiguo 05/09/2009, 18:45
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 8 años, 4 meses
Puntos: 137
Respuesta: Problema Div y Margen en IE!

????... mas codigo CSS HTML o una URL del problema o espera que kseso? pase con sus habilidiades misticas chao
  #3 (permalink)  
Antiguo 05/09/2009, 19:56
 
Fecha de Ingreso: febrero-2009
Mensajes: 16
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problema Div y Margen en IE!

la pagina es facciasas.com
  #4 (permalink)  
Antiguo 06/09/2009, 08:00
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Problema Div y Margen en IE!

div#login_area
flotado a la derecha y no a la izquierda.

Sin bola pero con código
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 06/09/2009, 11:45
 
Fecha de Ingreso: febrero-2009
Mensajes: 16
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problema Div y Margen en IE!

No, eso no me ayuda :S!

Eso solo hace que el div cambie de modo de alineación, pero no que el div de abajo (div#h_area) se ponga por encima de el.

El problema es que el div#login_area quede debajo del div#h_area, eso lo logro fácilmente en Chrome y Firefox, pero en IE8 nop, el div#h_area no queda por encima, si no que se mueve hacia abajo, osea, hacia el footer, como si el div#login_area no "flotara", por debajo de el.

Si lo abren con Chorme/Firefox VS IE8 notaran que hay una pequeña linea gris entre estos dos DIVs, pero en IE8 hay una mas grande, y es por que el div#h_area esta separado del div#login_area y no sobre el.
  #6 (permalink)  
Antiguo 06/09/2009, 12:43
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Problema Div y Margen en IE!

EL flotado anterior era para colocar las imágenes grandes en su sitio (debajo en "y" del login). Ya no es necesario (o bien no me cargó bien o tocaste algo que lo arregló)

En ie8 no puedo verlo, pero sí te puedo comentar que el "z-index" sólo se puede aplicar a elementos posicionados. Y como el valor por defecto de una caja es "static" y tú no tienes declarado otro, por eso los problemas.

También deberías ver la página en ie7 (el menú desplegado queda tapado por las imágenes grandes)

Así que aplica:
#top_menu ---> position: relative; z-index: 100;
#head_log ---> position: relative;
#login_area ---> margin: 30px 0 0 0; (ajusta los 30px a tu gusto)
#h_area ---> position: relative; z-index: 10;
Creo que con eso y cuidando algunas cosillas como "24px auto auto 15px" lo corregirás.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #7 (permalink)  
Antiguo 06/09/2009, 15:25
 
Fecha de Ingreso: febrero-2009
Mensajes: 16
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problema Div y Margen en IE!

:D nice

te agradezco mucho por los fix! ahora se ve mucho mejor en chrome y fx, ademas del problema con ie6, aunque aun no lo pruebo, no tengo ie6 :S.

Pero el problema del ie8 aun persiste :S!!

MS i hade u
  #8 (permalink)  
Antiguo 06/09/2009, 17:06
Avatar de HackmanC  
Fecha de Ingreso: enero-2008
Ubicación: Guatemala
Mensajes: 1.817
Antigüedad: 9 años, 10 meses
Puntos: 260
Sonrisa Respuesta: Problema Div y Margen en IE!

Hola,

Para IE8 podrías agregar :

Cita:
Iniciado por kseso? Ver Mensaje
#h_area ---> position: relative; z-index: 10; top: -4px;
Pero no creo que sea de mucha diferencia, y no te aconsejo que lo veas con IE6 que allí si tienes un problema.

Saludos,

ps:

Por otro lado, la animación Flash consume el 100% de uno de los procesadores en mi PC con la versión 10c de Flash.
  #9 (permalink)  
Antiguo 06/09/2009, 18:39
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Problema Div y Margen en IE!

Si solo tienes ese margen en ie8, corrígelo con un comentario condicional para esa versión:
Código html:
Ver original
  1. <!--[if IE 8]>
  2. <style type="text/css">
  3. #h_area {margin-top: -Xpx;}
  4. </style>
  5. <![endif]-->
Asegúrate de ponerlo después de hacer la llamada a todos los estilos.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #10 (permalink)  
Antiguo 06/09/2009, 21:45
 
Fecha de Ingreso: febrero-2009
Mensajes: 16
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problema Div y Margen en IE!

Cita:
Iniciado por HackmanC Ver Mensaje
Hola,

Para IE8 podrías agregar :



Pero no creo que sea de mucha diferencia, y no te aconsejo que lo veas con IE6 que allí si tienes un problema.

Saludos,

ps:

Por otro lado, la animación Flash consume el 100% de uno de los procesadores en mi PC con la versión 10c de Flash.
Cita:
Iniciado por kseso? Ver Mensaje
Si solo tienes ese margen en ie8, corrígelo con un comentario condicional para esa versión:
Código html:
Ver original
  1. <!--[if IE 8]>
  2. <style type="text/css">
  3. #h_area {margin-top: -Xpx;}
  4. </style>
  5. <![endif]-->
Asegúrate de ponerlo después de hacer la llamada a todos los estilos.
muchísimas gracias por su ayuda, el problema se soluciono :D!!
por otro lado, el banner flash es solo una "prueba" en realidad usare otro, aunque no se si tenga los mismos problemas!
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 13:14.