woocommerce-to-css-grid

woocommerce-to-css-grid.css

/* Convert the standard WooCommerce products list into a modern responsive grid. */
ul.products {
  --grid-gap: 32px;
  --auto-grid-min-size: 200px;
  grid-template-columns: repeat(auto-fill, minmax(var(--auto-grid-min-size), 1fr));
  grid-gap: var(--grid-gap);
  display: grid;
}
ul.products:before{
  content:unset!important;
}
ul.products li.product {
  width: 100%!important;
  display:flex;
  flex-direction:column;
}
ul.products li.product a.woocommerce-loop-product__link {
  flex-grow: 1;
}