Avisos
Vaciar todo

[Resuelto] Problema con la altura de los productos de mi tienda Woocommerce

6 Respuestas
2 Usuarios
0 Reactions
16 Visitas
Respuestas: 43
Eminent Member
Topic starter
 

Hola. Estoy intentando poner más bonita mi tienda Woocommerce y los productos me aparecen descompensados (unos más arriba que otros). Quisiera que salieran todos a la misma altura independientemente de la longitud del título. ¿Pueden decirme cómo hago esto con CSS adicional?

La web de la tienda es: https://juegosmontessori.com/tienda/

Muchas gracias.

Contenido solo visible a usuarios registrados


 
Respondido : 01/09/2023 12:40 pm
Karen Rios
Respuestas: 18826
Illustrious Member Moderator
 

Hola Jesica, 

En este caso prueba el siguiente código CSS:

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
display: flex;
flex-wrap: wrap;
}

Verifícalo y nos comentas como va todo

Un saludo 


 
Respondido : 01/09/2023 1:58 pm
Respuestas: 43
Eminent Member
Topic starter
 

No funciona.


 
Respondido : 01/09/2023 2:09 pm
Karen Rios
Respuestas: 18826
Illustrious Member Moderator
 

Hola Jésica, 

En este caso lo que veo es que los títulos son muy cortos y por ello se muestra de esta forma, revisa si el siguiente código CSS se muestra del mismo tamaño

@media (min-width: 768px) {

ul.products {
display: flex;
flex-wrap: wrap;
}

ul.products li.product {
display: flex;
flex-direction: column;
}

ul.products li.product .button {
margin-top: auto;
}

}

Ten en cuenta que la funcionalidad de esto puede variar de acuerdo al código de la plantilla y como lo adapta. 

Un saludo 


 
Respondido : 01/09/2023 2:24 pm
Respuestas: 43
Eminent Member
Topic starter
 

@karenMuchas gracias, finalmente lo conseguí con este código:

 

.woocommerce ul.products li.product {
display: flex;
flex-direction: column;
justify-content: space-between;
}

.woocommerce ul.products li.product a.button {
margin-top: auto;
}


 
Respondido : 01/09/2023 4:38 pm
Karen Rios
Respuestas: 18826
Illustrious Member Moderator
 

Hola Jesica, 

Enhorabuena lograste solucionarlo, es un placer siempre poder ayudarte. 

No dudes en escribirnos si tienes cualquier otra consulta. 

Un Saludo 😊 


 
Respondido : 01/09/2023 4:57 pm