Woocommerce产品只在智能手机的两列？

Question

当用户通过智能手机浏览商店时，我想让我的Woocommerce商店在商店中以两行显示我的产品。目前正在展示其他所有产品。告诉你我的意思：

目前：

以及我想如何做到：

我在某个地方找到了这个功能，但是如何只为智能手机工作？

add_filter( 'loop_shop_columns', 'wc_loop_shop_columns', 1, 10 );

/*
* Return a new number of maximum columns for shop archives
* @param int Original value
* @return int New number of columns
*/
function wc_loop_shop_columns( $number_columns ) {
    return 2;
}

编辑：

我找到了这个css，当CSS Inspector中的插入工作应该是，但是当将其插入到自定义CSS中时：

@media (max-width: 480px)  {

.entry-content .products li {
 float: left;
  width: 50%;
  }
}

但似乎没有做任何改变..我做错了什么？

提前致谢！

Answer 1

这解决了我的问题，现在看起来对任何智能手机都很好：

@media (max-width: 480px)  {

.entry-content .products li {
 float: left;
  width: 50%;
 }
}