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
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
No funciona.
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
@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;
}
Hola Jesica,
Enhorabuena lograste solucionarlo, es un placer siempre poder ayudarte.
No dudes en escribirnos si tienes cualquier otra consulta.
Un Saludo 😊