Как в грид сделать фиксированные элементы и задать gap?

Question

[f1ip]

Не могу разобраться как сделать так, что бы при изменении размера окна, блоки в гриде не растягивались до прямоугольников, а оставались квадратные независимо от размера экрана и картинки внутри блока не обрезалась.
Ставил фиксированные размеры в .flip-card-inner, блоки остаются квадратные но при адаптиве они все не по центру, а выравнивание идет по левому краю и при этом gap по ширине не равен промежутку по длине, они разные
как поправить? помогите пожалуйста
вот проект на codepen
https://codepen.io/homedist/pen/GRBdYQz

Answer 1

[Александр]

- grid-template-columns: repeat(auto-fill, minmax(250px, auto));
+ grid-template-columns: repeat(auto-fill, 250px);

Comments

[f1ip]

Идет выравнивание по левому краю в таком случае, как расположить сетку всегда по центру?

[Александр]

f1ip, justify-content: center;

[f1ip]

Александр, Спасибо, очень помогли!!!!