He estado probando las tarjetas invertidas incluidas en Canvas, el recurso de plantillas HTML, y ahora quiero implementarlas en un sitio web preexistente real.

En mi página de prueba, las tarjetas estaban en el medio de la pantalla, su altura se podía cambiar con un atributo data-height-xl en el HTML, que también aparece en el JavaScript que ejecuta la página, e incluso se reorganizaban si uno de las tarjetas era demasiado largo. Ejemplo aquí (eliminé las imágenes y el texto, pero las tarjetas funcionan)

Sin embargo, en el sitio web en el que quiero agregar esto, las tarjetas están estiradas a los lados de la página y todas tienen la misma altura (por eso, ni siquiera sé si todavía se reorganizan). Traté de comparar y hacer cambios en el código JS/CSS que ya estaba en el sitio web (que también usa plantillas de Canvas) con lo que usé para mis pruebas, pero no pude avanzar mucho más. Siento que el estiramiento proviene de contenedores en la página (pero puede que me equivoque), pero no tengo idea de qué impide que los cambios de altura surtan efecto.

Lo siento si no es realmente comprensible. Esta es mi primera pregunta aquí y todavía soy un principiante en HTML/CSS.