Avisos
Vaciar todo

[Resuelto] Columnas responsive  

 
Alexandra
 Alexandra
Usuario experto

Hola, como puedo hacer para que cuatro columnas con dos filas me aparezca en el movil en doble columna todo, es decir, cada icono por parejas. Adjunto capturas de pantalla. (He marcado en verde como me gustaría que apareciese. Muchas gracias!

Screenshot (42)

 

Screenshot (41)

 

Contenido solo visible a usuarios registrados

Citar
Respondido : 08/06/2022 2:07 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Alexandra.

Prueba con esto:

@media only screen and (max-width: 600px) {
.et_pb_row_4col>.et_pb_column.et_pb_column_1_4 {
width: 47.25%!important;
}
}

 

Puedes añadirlo en apariencia -> personalizar -> CSS adicional.

 

Un saludo

ResponderCitar
Respondido : 08/06/2022 2:34 pm

Alexandra
 Alexandra
Usuario experto

@pepesoler queda genial, muchas gracias!

ResponderCitar
Respondido : 09/06/2022 8:03 am
Alexandra
 Alexandra
Usuario experto

@pepesoler Donde puedo aprender a escribir código? Algo básico? Muchas gracias de nuevo.

ResponderCitar
Respondido : 09/06/2022 8:03 am

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Alexandra.

Tienes un curso de CSS en este enlace:

-> https://www.webempresa.com/university/curso-css-wordpress/

Te ayudara a identificar las clases y a poder trabajar con el inspector del navegador.

 

Un saludo

 

ResponderCitar
Respondido : 09/06/2022 9:19 am
Alexandra
 Alexandra
Usuario experto

Muchas gracias Pepe, aunque ahora veo que se me han movido las columnas del footer con este código y se me montan una encima de la otra. Hya algo para que el código solo funcione en una página nada más? Muchas gracias de nuevo.

ResponderCitar
Respondido : 09/06/2022 5:15 pm

Argenis
 Argenis
Soporte CMS Webempresa Moderator

Hola Alexandra,

Veo que no tienes la sección agregada, puedes compartirnos el enlace donde lo tienes agregado? ingreso a la pagina de contacto pero no logro visualizar lo que nos comentas.

Un saludo 🖐️ 

ResponderCitar
Respondido : 09/06/2022 5:39 pm
Alexandra
 Alexandra
Usuario experto

Hola, lo puedes ver en el footer de la página inicial, se montan unas columnas en otras. como puedo hacer para que aquí salga normal y en la página de tiendas se quede como está?

ResponderCitar
Respondido : 29/07/2022 4:48 pm

Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Alexandra, 

Entiendo que te refieres a esta sesión de las columnas

image

Si es asi en este caso revisa si con el siguiente código CSS se muestra de forma correcta

@media only screen and (max-width: 600px) {
footer.et-l.et-l--footer .et_pb_module.et_pb_text.et_pb_text_1_tb_footer.et_pb_text_align_center.et_pb_bg_layout_light.et_had_animation {
margin-left: 32px;
}
}

Un Saludo

 

ResponderCitar
Respondido : 29/07/2022 5:03 pm
Alexandra
 Alexandra
Usuario experto

@karen he puesto el código en la sección de columna y en el apartado "elemento principal", pero no me aparece el cambio. Quizás lo debo de poner en otro lugar? GRacias.

ResponderCitar
Respondido : 10/08/2022 10:07 am

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Alexandra.

Elimina el código que añadiste en el modulo y añade lo siguiente en Apariencia -> Personalizar -> CSS Adicional:

@media only screen and (max-width: 600px) {
footer.et-l.et-l--footer .et_pb_row_4col>.et_pb_column.et_pb_column_1_4 {
width: 100%!important;
}
}

 

Un Saludo

 

ResponderCitar
Respondido : 10/08/2022 10:48 am