Comunidad PHPeros
Lenguajes => CSS => Mensaje iniciado por: maska en 26 de Octubre de 2012, 17:51:41 pm
-
Hola amigos. Escribo aquí en última instancia por estar desesperado. Ya que llevo varios días pensando y no consigo lograrlo. Adjunto imágenes y os explico más detalladamente.
IMAGEN CORRECTA: http://www.lacomparsademorta.16mb.com/img/correcto.PNG
IMAGEN INCORRECTA: http://www.lacomparsademorta.16mb.com/img/incorrecto.PNG
Mi objetivo es conseguir que todo este en position:fixed;, menos el div con el borde rojo. El div que tiene el borde rojo quiero que sea auto para leerse la información. Esto que he explicado lo he conseguido. Pero al darle zoom a la página y mover el scroll horizontal se mueve el div con el color de borde rojo y da como error la IMAGEN INCORRECTA.
Espero que me podáis ayuda amigos.
Gracias.
{include file="header.tpl"}
<div id="wrap" class="clearfix">
<div id="container">
<div id="cabecera">
cabecera position:fixed
</div><!-- class cabecera -->
<div id="wrapContenedor">
<div id="c1Wrap">
<div id="c1">
Columna 1 de menu position:fixed
</div><!-- div c1 -->
</div><!-- div c1Wrap -->
<div id="c23Wrap" class="sombra1">
<div id="c2Wrap">
<div id="c2">
Columna 2 de informarcion
</div><!-- c2 -->
</div><!-- c2Wrap -->
<div id="c3Wrap">
<div id="c3">
Columna 3 de publicidad position:fixed
</div><!-- div c3Wrap -->
</div><!-- div c3Wrap -->
</div><!-- div c23Wrap -->
</div><!-- div wrapContenedor -->
</div><!-- fin de container -->
{include file="foother.tpl"}
</div><!-- FIN DE WRAP -->
#wrap {margin:0 auto; text-align:left; width:950px; overflow:hidden;}
#container {overflow:hidden; margin:60px 0px 0px 0px;}
#cabecera {width:908px; margin-top:-20px !important; padding:10px 20px; border:1px solid #CCC; border-top:none; overflow:auto; background:#FFF; z-index:200; position:fixed;}
#wrapContenedor {width:950px; padding-top:30px;}
#wrapContenedor #c1Wrap {float:left; width:100px; z-index:50;}
#wrapContenedor #c1Wrap #c1 {padding-top:20px; position:fixed;}
#wrapContenedor #c23Wrap {width:808px; float:left; margin-left:100px; margin-bottom:20px; padding:20px; padding-bottom:0px !important; background:#FFF; border:1px solid #CCC; border-top:none; -moz-border-radius:0px 0px 5px 5px; -khtml-border-radius:0px 0px 5px 5px; -webkit-border-radius:0px 0px 5px 5px; border-radius:0px 0px 5px 5px; z-index:40px;}
#wrapContenedor #c2Wrap {float:left; width:600px; position:relative;}
#wrapContenedor #c2Wrap #c2 {margin-right:20px;}
#wrapContenedor #c3Wrap {float:left; width:208px;}
#wrapContenedor #c3Wrap #c3 {width:208px; position:fixed;}
-
¿Y que necesitas? ¿Que el fixed de la izquierda desaparezca de la pantalla?
¡No puedes hacer eso con fixed!
Quizás con absolute y algo de javascript puedas lograrlo.
Saludos
-
¿Y que necesitas? ¿Que el fixed de la izquierda desaparezca de la pantalla?
¡No puedes hacer eso con fixed!
Quizás con absolute y algo de javascript puedas lograrlo.
Saludos
No. No quiero que el div de la izquierda desaparezca. Todo lo contrario. El div de la izquierda que contiene el menú en vertical quiero que permanezca fixed (cosa que ya tengo). Y el div del recuadro quiero que tenga height:auto.
El problema es que cuando le doy zoom y me sale el scroll horizontal, pues, lo muevo y me sale lo que puse en la IMAGEN INCORRECTA.
¿Alguna sugerencia? Quiero lograr este resultado https://plus.google.com/?hl=es
-
Sin ver el código no me sé orientar.
Puedo darte 100 lineas de código que ya tengas implementadas.
Un saludo
-
Sin ver el código no me sé orientar.
Puedo darte 100 lineas de código que ya tengas implementadas.
Un saludo
Ya escribí el código. A ver si me ayudas, amigo. Te lo agradeceré enormemente. GRACIAS, de antemano.