Question

我正在努力解决这个问题，我找到了解决办法，但这并不像我想象的那样，我想拥有什么，所以我在这里寻求更多更聪明的思想：）

我的网上商店在移动布局上每行显示一个产品，例如：

但我希望连续两次看到它。现在，这就是问题所在：在Virtuemart的配置中，显示每行的产品设置为3，因为我希望在计算机和桌面设备（也包括笔记本电脑和更大的平板电脑）上每行看到3个产品，所以这样就可以了。工作正常。

但是在移动设备上，在模板mobile.css中，这总是设置为连续显示1.所以我搜索并找到了代码

.category-view .vm-col-3

设置为width: 100%

当我将其插入50％时，我得到了这个：

我插入了clear: none和float: left没有发生任何事情。所以我弄明白我必须找到一些.row代码，因为我看到这是连续3个产品，就像它在Configuration中设置的一样，现在它只是更小并且像这样排序，但仍然不像我想要的有

然后，我找到了设置行的行：

.category-view .browse-view .row

并插入此行：

clear: none;
float: left;
width: 50%;

有了这个，结果是最接近的，但仍然不是我需要的。总是当它结束9个产品时，接下来的3个是另一个（3个产品），然后再连续两个开始，并在9个产品后重复。

你可以在这里看到它（用手机）：box2.appleoprema.com/index.php/iphone6-maskice-i-zastita

有人可以告诉我，如何解决这个问题？我已经尝试了很多方法和代码来解决这个问题，3天之后我就不知道该怎么办了。在此先感谢您的帮助。

Answer 1

嗨，看了看容器的结构似乎是这样的

行 COL-1 COL-2 COL-3 行等...

所以在行中添加width: 50%;会使一切变得混乱，因为每行都分配了3个产品。

您可以执行width: 33%到.product.vm-col.vm-col-3 media="(max-width: 640px)"每行显示3个产品或保留原样，以便列显示100％的宽度每排1个产品。

如果您希望每行有2个产品用于移动显示，那么您应该检查后端是否有这样的选项或调整您正在使用的组件/模块的html。