Product list image aspect ratio (CSS)

By default the aspect ratio of images shown on list modules with products listed will be 1:1 (square).

This can be overridden with some custom CSS added in site settings:

Site Settings > Design > Custom Styles

Either to remove the constraint and show the full height of the image. Note: this will result in uneven listing heights if the images are inconsistent.

.product-image-box .main-product-image {
  position: unset;
}

.product-image-box::after {
  display: none;
}

Or to change the aspect ratio across all products to be something other than 1:1 (square).

.product-image-box::after {
  padding-bottom: 75%;
}

Use the following percentages for the listed aspect ratios:

1:1	100%
4:3	75%
3:2	66.67%
16:9	56.25%
2:1	50%