Divs en horizontal escalables...
5 seguidores
Hola a a todos!, estoy haciendo un proyecto web y necesito un poco de ayuda...
Necesito mostrar 4 divs en horizontal pero escalables, a medida que se va estrechando la pantalla estos divs se estrechan empujandose entre ellos sin pasar a la linea de abajo ninguno de ellos y manteniendo siempre la misma separación entre ellos... es posible coseguir algo así? me estoy volviendo un poco loco...
Gracias de antemano y un saludo!!!!
ponchi
Entiendo que esos divs van un después de otros en la misma línea, prueba con esta css
div{
float: left;
display: block;
width: xx%;
margin-left: xx%;
margin-right: xx%;
}
alo
Efectivamente van en la misma lñinea... voy a probar a veeeeeeeeer....
alo
Pues parece que por ahí va la cosa, pero cuando estrechas la ventana comienzan a estrecharse los div tal y como necesito pero llega un momento en el que el de mas a la derecha se pasa abajo....
smalonso Mod
Los porcentajes tanto de los márgenes cómo del ancho deben sumar 100% en total. Si pones un margen con píxeles y el ancho un porcentaje a ojo este te saltará seguro.
ponchi
Ademas de lo que te dice hoher, mira a ver si el contenedor dónde se sitúan los divs tiene un padding
alo
Gracias por las rápidas respuestas... lo pruebo y os cuento...
alo
Parece que, como dice hoher, la cosa está en ajustar los porcentajes de todo...
GRACIAS!!!
alo
Bueno y ya metidos en harina.... resulta que el div de mas a la derecha NO es escalable, o sea que tiene que mantener en todo momento su ancho pero si debe empujar los demás según estrechamos la ventana...
Siento ser pesado pero es que el tema de responsive se me atraganta un pelín...
Gracias!!!!
fakito
Eso podrías hacerlo con el flexbox, así en plan rápido me sale esto:
http://codepen.io/anon/pen/bjlhF
ponchi
Ponle un tamaño fijo pero entonces llegará un momento que no entre y se baje a la otra línea. Para el tema responsive utiliza para los css mediaqueries
hartum
Viendo el nivel que esta cogiendo esto ¿has probado a usar un framework como bootstrap3?
yo encantado de la vida con el oiga!!!
alo
Nunca he probado flexbox... y que tal funciona con toooodos los navegadores?
... y en cuanto a bootstrap.. probaré... nunca está de mas...
Gracias por vuestra ayuda....
fakito
El flexbox no debería dar muchos problemas con navegadores modernos, me imagino que el más problemático podría ser ie, puedes ver el soporte aquí y decidir si te vale o no:
http://caniuse.com/flexbox