cambiar de ubicación elemento al reducir tamaño responsivo?

[00israel]

Hola a todos, quisiera saber si yo puedo cambiar de ubicación un elemento que se encuentra dentro de un div a otro div cuando se va redimensionando la pagina?

no se si me he explicado.

Mejor os pongo algo visual:



Imaginaos dos div, uno superior donde se ubica el logo a la izquierda y cuatro logos de redes sociales a la derecha y cuando la pagina se hace mas pequeña quiero que esos iconos bajen al div de abajo que es un menú.

¿es posible eso?

un saludo.

[Zeromm]

A ver, no puedes cambiar un elemento de un div a otro "propiamente dicho". Visualmente si, pero semanticmente no, ya que no modificas el HTML al hacer una web responsive, modificas el css. El html queda totalmente "inalterable", a no ser que lo modifiques a mano.

Con "position: absolute", visualmente, si puedes conseguir de manera muy facil lo que quieras.

[00israel]

Gracias zeromm, entendido, probaré lo que me comentas. Pero esto se suele hacer así en estos casos?

[Zeromm]

No hay otra forma de meter el contenido de un div dentro de otro div con css que no sea con position: absolute... si eso es lo que quieres hacer, no es que sea lo correcto o no, es que es la unicaa forma xDD.

De todas formas lo "correcto" es no tener que cambiar cosas de un div a otro, si no cambiar los divs de posición, no de contenedor. No entiendo porque tienes la necesidad de cambiar un div de contenedor... eso significa que seguramente el código no esté correctamente desarrollado.

[00israel]

No habia caido en esto ultimo que me comentas. En lugar de tener estos elementos en divs distintos los puedo meter en uno solo.

Probaré esto que me comentas.

Gracias

[pzin]

Tienes que discernir lo estructural de lo visual. Tener dos elementos no significa que esos elementos sean visualmente diferenciados. O pueden no estarlo a priori y reduciendo el ancho del navegador si estarlo. Intenta ver en el diseño el código y luego aplicar una lógica estructural.

[al_limon]

Entiendo lo que necesitas, pero como te dicen por ahí arriba, es el css lo que tienes que modificar, no el html.

Te recomiendo meter en el mismo contenedor el logo y las redes sociales, pero con contenedores individuales para que quede un padre con dos hijuelos (los hijuelos deben tener float y ser relativos). En el css, dile que cuando el padre cambie su ancho, que el hijo que contiene el logo, no tenga nada al lado (con clear lo consigues) y así obligas al otro hijo a bajar.

Esto explicado a grandes rasgos... Te recomiendo medidas en %.

Suerte!

PD: La recomendación de Pzin, es buena ("Intenta ver en el diseño el código y luego aplicar una lógica estructural.")

[00israel]

Gracias chicos