Woocommerce - 将每行单个产品更改为多个（移动响应）

Question

我正试图让woocommerce在屏幕尺寸小于480px时显示2或3（我想测试两者，因为我不确定哪种产品最适合）产品，而不是默认值1 （移动）。

目前看起来如何; http://prnt.sc/e0m1l7

网站：http://historicmotorsporttransmissions.com/shop/

我一直在寻找一个插件来帮助，但我认为css可以完成这项工作。所有的代码片段似乎都基于某个主题，并且无法使它们正常工作。

请有人伸出援助之手吗？ 非常感谢-Lewis

Answer 1

一个选项是在你的CSS中尝试这个：

@media all and (max-width: 480px){
  .woocommerce .products li.product {
      width: 50% !important;
  }
}

如果您想显示3，请更改为33.33％。