Foros del Web » Creando para Internet » CSS »

Css scroll que desplaza div en firefox

Estas en el tema de Css scroll que desplaza div en firefox en el foro de CSS en Foros del Web. Hola. He buscado algun post al respecto pero no he encontrado. El caso es que tengo un diseño de 3 columnas ( menu, datos, avisos ...
  #1 (permalink)  
Antiguo 21/11/2008, 21:35
 
Fecha de Ingreso: noviembre-2008
Mensajes: 270
Antigüedad: 9 años, 1 mes
Puntos: 1
Css scroll que desplaza div en firefox

Hola. He buscado algun post al respecto pero no he encontrado.
El caso es que tengo un diseño de 3 columnas ( menu, datos, avisos ) y estoy tratando de colocar un scroll solo sobre la columna 2 ( datos ), que tiene un alto delimitado en 600px.
El problema es que si habilito el scroll vertical esta columna se desplaza entera saliendose de su lugar y posicionandose en parte sobre la 3era columna.

¿Alquien tiene idea de que puede estar pasandome?
  #2 (permalink)  
Antiguo 21/11/2008, 21:36
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.711
Antigüedad: 12 años, 7 meses
Puntos: 833
Pregunta Respuesta: Css scroll que desplaza div en firefox

¿Podrías poner un enlace a tu página o en su defecto el código en cuestión?.
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #3 (permalink)  
Antiguo 21/11/2008, 22:00
 
Fecha de Ingreso: noviembre-2008
Mensajes: 270
Antigüedad: 9 años, 1 mes
Puntos: 1
Respuesta: Css scroll que desplaza div en firefox

Gracias David, por tu pronta respuesta.

no lo tengo colgado, a ver si te paso esto y puedo orientarte:

tengo una .css donde defino:
#centro {
width: 655px;
margin-left: 155px;
padding: 0px;

overflow-y: scroll;
overflow-x: hidden;
height: 900px;

}


el index.php tiene includes con las distintas divs ( encabezado, columna 1, columna 2, columna 3, y el pie)

el index invoca a la columna 2 asi:

<? include("centro.php"); ?>


y centro.php (resumido) es:

<div id="centro">
<div id="centro_recuadro">
<? $foto_aleatoria = rand(1, 12); ?>
<? echo "<img src='imagenes/fotos_".$foto_aleatoria.".jpg' width='647' height='297' align='top'>" ?>
</div>

<div id="centro_recuadro">
<img src="imagenes/anunciantes/centrales/hotel_1.jpg" align="top">
</div>

</div>

Espero puedas ver algo, sino veo de subirlo a algun lado.
Pero basicamente el tema es que en IE7 se ve bien, pero en Firefox la columna 2 se sale de lugar solo si habilito el scroll, sino se ve barbaro.
  #4 (permalink)  
Antiguo 21/11/2008, 22:04
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.711
Antigüedad: 12 años, 7 meses
Puntos: 833
Respuesta: Css scroll que desplaza div en firefox

Será más fácil realmente ver el error viendo todo el contexto de la página, si puedes subirlo a algún lado, mejor, o por lo menos coloca el código resultante (la salida HTML que se genera con el código PHP).
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #5 (permalink)  
Antiguo 21/11/2008, 23:07
 
Fecha de Ingreso: noviembre-2008
Mensajes: 270
Antigüedad: 9 años, 1 mes
Puntos: 1
Respuesta: Css scroll que desplaza div en firefox

David, le he quitado todo para ver concretamente el problema. Aquí lo copio:

formato_general.css:

.contenedor {
margin-left: auto;
margin-right: auto;
width: 1000px;
height: 600px;
background-color: #FFFFFF;
display:table;
}

#cabecera {
height: 170px;
width: 1000px;
background:#33CC66;
}

#columna-izquierda {
float: left;
width: 143px;
height:700px;
background:#CCCC00;
color: #fff;
}

#centro_con_scroll {
width: 650px;
height: 800px;
margin-left: 155px;
padding: 0px;
overflow: auto;
overflow-x: hidden;

}

#centro_sin_scroll {
width: 650px;
height: 800px;
margin-left: 155px;
padding: 0px;
}

#centro_recuadro {
border: thick solid #CCCCCC;
height: 300px;
background:#006600
}


#columna-derecha {
background:#FF0000;
float: right;
width: 160px;
height: 600px;
padding-top: 0px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
}





index.php :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0014)about:internet -->
<HTML xmlns="http://www.w3.org/1999/xhtml">
<HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<META http-equiv=imagetoolbar content=no>

<link media=all href="formato_general.css" type="text/css" rel="stylesheet" />
<!--[if lte IE 6]><LINK media=all href="formato_general_ie.css" type=text/css rel=stylesheet><![endif]-->


<style type="text/css">
<!--

body {
background-color: #FFFFFF;
}

.Estilo1 {color: #333333}

-->
</style>
</head>

<body>

<div class="contenedor">

<div id="cabecera"></div>

<div id="columna-izquierda"></div>
<div id="columna-derecha"></div>

<div id="centro_con_scroll">
<div id="centro_recuadro"></div>
<div id="centro_recuadro"></div>
<div id="centro_recuadro"></div>
<div id="centro_recuadro"></div>
</div>

</div>

</body>
</html>



En la columna del centro, si utilizo la div=centro_sin_scroll, las columnas se ven donde deben, pero si utilizo la div=centro_con_scroll, es ahí donde Firefox me la desplaza parte encima de la columna derecha.

Espero puedas ayudarme. Gracias.
  #6 (permalink)  
Antiguo 21/11/2008, 23:29
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.711
Antigüedad: 12 años, 7 meses
Puntos: 833
Respuesta: Css scroll que desplaza div en firefox

mmm... he probado con ese código y no logré reproducir el error que mencionas .
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #7 (permalink)  
Antiguo 21/11/2008, 23:38
 
Fecha de Ingreso: noviembre-2008
Mensajes: 270
Antigüedad: 9 años, 1 mes
Puntos: 1
Respuesta: Css scroll que desplaza div en firefox

¿No has visto la diferencia??? Pues que raro. Estoy usando Firefox 2.0. Será que tengo una versión vieja?
Verás que la columna se desplaza del medio y se posa sobre parte ( no completamente) sobre la derecha, si usas div=centro_con_scroll . Si usas div=centro_sin_scroll, quedan las columnas debidamente dispuestas.
No entiendo que puede ser que no lo veas igual que yo.
  #8 (permalink)  
Antiguo 21/11/2008, 23:51
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.711
Antigüedad: 12 años, 7 meses
Puntos: 833
Respuesta: Css scroll que desplaza div en firefox

Yo uso la versión 3 . En este caso habrá que esperar a los masters para que lo vean (Ej.: Mikmoro ).
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #9 (permalink)  
Antiguo 21/11/2008, 23:54
 
Fecha de Ingreso: noviembre-2008
Mensajes: 270
Antigüedad: 9 años, 1 mes
Puntos: 1
Respuesta: Css scroll que desplaza div en firefox

Mmmhh... voy a bajar la version 3 y ver que pasa. A ver si es eso.
  #10 (permalink)  
Antiguo 22/11/2008, 00:27
 
Fecha de Ingreso: noviembre-2008
Mensajes: 270
Antigüedad: 9 años, 1 mes
Puntos: 1
Respuesta: Css scroll que desplaza div en firefox

Bueno, evidentemente es así. En la versión 3 de Firefox anda bien. En la 2 no. Igual quisiera dejar esto abierto porque quiero que esto me ande en cualquiera de las versiones de Firefox, porque aun creo que se usa bastante la 2.
Gracias David.
  #11 (permalink)  
Antiguo 22/11/2008, 06:15
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
Respuesta: Css scroll que desplaza div en firefox

El asunto es: si a esa columna le colocas scroll, ya no necesitas el margen izquierdo para salvar la columna izquierda como harías si no tuviera scroll.

Quítale el margen izquierdo e irá a su sitio, tanto con FF2 como con FF3.

Por otro lado, si de paso le quitas el width ocupará todo el espacio que le queda disponible, y se te ajustará a derecha e izquierda automáticamente (FF2 y 3, IE6 y 7, Chrome, Safari 1.5, Opera 9.5)
__________________
Visita mi nueva web idplus.org
  #12 (permalink)  
Antiguo 22/11/2008, 07:44
 
Fecha de Ingreso: noviembre-2008
Mensajes: 270
Antigüedad: 9 años, 1 mes
Puntos: 1
Respuesta: Css scroll que desplaza div en firefox

Muchas gracias MIKMORO !!!
Con esa corrección anda perfectamente como has dicho.
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 04:38.