Foros del Web » Creando para Internet » CSS »

Problema con Firefox y dos columnas.

Estas en el tema de Problema con Firefox y dos columnas. en el foro de CSS en Foros del Web. De ves en cuando me sabe aparecer la columna derecha justo cuando termina la izquierda en firefox. No me pasa en opera crome o ie. ...
  #1 (permalink)  
Antiguo 06/03/2009, 01:19
 
Fecha de Ingreso: marzo-2007
Mensajes: 340
Antigüedad: 10 años, 9 meses
Puntos: 4
Problema con Firefox y dos columnas.

De ves en cuando me sabe aparecer la columna derecha justo cuando termina la izquierda en firefox. No me pasa en opera crome o ie. (es al azar, entro y aparece bien, vuelvo a entrar a los 10 min y se ve mal)

Es decir, aparece debajo de la columna izquierda cuando deberia aparecer al lado de esta. (deberia ser siempre como en el ejemplo 2 , ver grafico)

ej:



Solo pasa a veces, por lo tanto tiro bordes para ver que no se toquen y efectivamente no lo hacen, mi metodologia para las columnas es esta:

CSS:

Código:
<style type="text/css">
#madre { border:2px solid #CCCCCC; width:1000px; margin:auto;}
#madre #wrapper { clear:both; display:table; width:999px }
#madre #wrapper #izquierda { float:left; width:500px; border:1px solid black }
#madre #wrapper #derecha { float:right; width:494px; border:1px solid black }
</style>
HTML:

Código:
<div id="madre">
<div id="wrapper">
<div id="izquierda">asdasd<br />asdsadasd<br />sadsadasd</div>
<div id="derecha">asdasd</div>
</div>
Alguna idea ? gracias.
  #2 (permalink)  
Antiguo 06/03/2009, 03:41
Avatar de talmente  
Fecha de Ingreso: noviembre-2007
Mensajes: 233
Antigüedad: 10 años
Puntos: 4
Respuesta: Problema con Firefox y dos columnas.

Hola, mi ra esto

madre width:1000px;

wrapper width:999px;

izquierda width:500px;

#derecha width:494px;


La suma de los tres div es superior a la de madre
  #3 (permalink)  
Antiguo 06/03/2009, 11:46
 
Fecha de Ingreso: marzo-2007
Mensajes: 340
Antigüedad: 10 años, 9 meses
Puntos: 4
Respuesta: Problema con Firefox y dos columnas.

Pero el wrapper esta dentro de la madre, es como tener un rectangulo apenas mas pequeño dentro del otro para luego poner dos mas pequeños.

No entiendo porque sumas los 3, saludos.
  #4 (permalink)  
Antiguo 06/03/2009, 11:53
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Problema con Firefox y dos columnas.

Es por la interpretación distinta que hacen los navegadores del modelo de caja (box model): el espacio total es la suma del ancho + bordes laterales o que se considere a los bordes como parte del ancho total.

Reduce unos pixeles la anchura del div "izquierda" o "derecha" para evitarlo.

P.D.: en el código html que has colocado te falta por cerrar el div "madre"
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
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 23:37.