Comunidad de diseño web y desarrollo en internet online

El overflow horizontal

Citar            
MensajeEscrito el 12 Sep 2012 11:49 am
Buenas a todos, soy nuevo en el foro, aunque alguna que otra vez buscando ayuda con el señor google había acabado por estos lares.

Tengo una duda con el overflow a la hora de hacer un scroll solamente horizontal.

Tengo un div llamado <div id="contenedorminiaturas"> un div con el que definiré la anchura y la altura
Dentro de este div, tengo otro llamado <div id="miniaturas"> donde se guardarán todas las imagenes en pequeño, y una al lado de la otra.

Los codigos que tengo son los siguientes:

Código CSS :

#contenedorminiaturas {
   width: 905px; 
   min-height: 100px;
   max-height: 100px;
   overflow-x: scroll;
   overflow-y: hidden;
}

Código CSS :

.miniaturas {
   min-height: 80px;
   max-height: 80px;
   margin: 1px 2px;
   display: inline;
}


la cosa es que la barra horizontal nunca aparece (bueno solo aparece como deshabilitada, en color grisaceo), y no consigo que se desplace nunca.

espero que puedan ayudarme!

y gracias de antemano!

Por ardillamaldita

5 de clabLevel



 

Programador Web

chrome
Citar            
MensajeEscrito el 12 Sep 2012 12:29 pm
hola.
Yo lo que haría es lo siguiente:

Código :

<div id="contenedorminiaturas">
     <div class="miniaturas">
           <img src="loquesea" alt="miniatura1"/>
           <img src="loquesea" alt="miniatura2"/>
           <img src="loquesea" alt="miniatura3"/>
            <img src="loquesea" alt="miniatura4"/>
     </div>
</div>

en el css:

Código :

#contenedorminiaturas {
   width: 905px; 
   height: 100px;
   overflow: auto;
}
.miniaturas {
   height: 100px;
   margin: 0;
   min-width:925px
}
.miniaturas img{
    display:inline;
    float:left;
    margin-rigth:10px;
}

Espero haberte ayudado

Por terreo76

12 de clabLevel



 

Diseñador web

firefox
Citar            
MensajeEscrito el 12 Sep 2012 02:32 pm
ok, grácias, probaré esto mañana! y te aviso!

Por ardillamaldita

5 de clabLevel



 

Programador Web

chrome
Citar            
MensajeEscrito el 13 Sep 2012 08:40 am
me hace como siempre, el scroll horizontal se desplaza nada y menos, y las imagenes continuan poniendose debajo una vez ha llegado al final, haciendo que sea un scroll vertical en vez de horizontal

Por ardillamaldita

5 de clabLevel



 

Programador Web

chrome
Citar            
MensajeEscrito el 14 Sep 2012 09:20 am
¿hay posibilidad de que pueda ver la página? es mucho más facil verla en "vivo" y poder intentar diferentes soluciones.

Por terreo76

12 de clabLevel



 

Diseñador web

firefox
Citar            
MensajeEscrito el 14 Sep 2012 09:42 am
Bueno, sino te sirve la imagen de como está realizado, intentaré poner el código que tengo.



Diferenciamos diferentes partes:
1 - Un div que contiene todo.
2 - Un div donde se verá la imagen en grande
3 - Un div donde se ven las imágenes en miniatura

No estoy muy seguro si dentro del 3r div ha de haber otro el cual hará la función de scroll, o no hace falta.

Pero como puedes ver, el scroll horizontal casi ni hace nada y todo se va debajo.

Por ardillamaldita

5 de clabLevel



 

Programador Web

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.