Sección 2 columnas en Elementor con una fullwidth

Hola, hoy vengo con un nuevo vídeo de Elementor en el que os explico cómo hacer un layout un tanto diferente a lo que vemos actualmente.

Uno de los recursos más habituales en diseño web es colocar una imagen acompañada de un texto explicativo al lado. Esto es un tema muy sencillo de resolver con Elementor, simplemente colocamos dos columnas, en una la imagen y en la otra el texto. Podemos optar por el ancho de «caja» en el que las columnas quedarían confinadas al ancho del contenedor que tengamos definido…o bien «ancho completo», donde las columnas llegarían a los bordes del navegador.

Pero…y si queremos una mezcla de los dos? una columna fullwidth y que la otra se mantenga dentro del contenedor?
El truco es el siguiente: seleccionamos ancho completo en la sección y restringimos en css una de las columnas a mitad del ancho del máximo que tengamos definido.

Os pongo unos ejemplos reales para que veáis lo que se puede hacer y a continuación, el vídeo con la explicación:

Código:

CSS personalizado:
selector .elementor-column-wrap {
max-width:600px;
margin-left: auto;
}

Si te ha gustado, comparte!

WhatsApp
Facebook
Twitter

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *