Cómo alinear precios y botón en grilla de productos con Elementor

guasacacanetwork · 2 Dic 2020

Hola, compañeros.

Estoy creando una tienda online con elementor, y tengo problemas con la grilla de productos. Quiero que lo precios están siempre alineados en altura, y que el botón de añadir al carrito esté posicionado en la parte inferior de la caja.

Actualmente esto se desorganiza cuando en una misma fila, los nombres tienen 1 o 2 líneas.

También quiero limitar el número de caracteres en el nombre del producto para que no exceda las 2 líneas.

esta grilla de productos esta hecha con elementor, y dentro de las opciones de elementor no me deja configurar esto.

Alguna sugerencia? la agradezco de antemano.

Saludos.

Stron · 2 Dic 2020

Revisa cual es la clase (CLASS) para el contenedor de los nombres del producto. A esa clase dale un overflow:hidden, text-overflow: ellipsis, white-space: nowrap.
Con eso podras limitar a 1 sola linea, y cortar el texto con puntos suspensivos.

HTML:

.titulo {
      width: 230px; // debes determninar el ancho maximo del la caja.
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
}

Cómo alinear precios y botón en grilla de productos con Elementor

guasacacanetwork

Stron