Woocommerce 产品目录全宽和标题 + 图像价格（叠加）

Question

我正在尝试使用 Woocommerce 实现产品图片之间几乎没有间距的全宽产品目录。我设法消除了产品图片之间的间距，但行不是全宽的，两边都有巨大的填充。此外，如何在图像顶部获取标题和价格？我一直在搞乱 css 但没有找到运气。

最终结果应如下所示：

acnestudios.com/de/de/man/new-arrivals/

非常感谢您的帮助，

R

Answer 1

根据我阅读的内容，只需创建或 select 带有价格的 class 并添加我在下面写的内容。

.your-class {
position: absolute;
top: 0;
left: 0;
z-index: 10;
}

对于网格我帮不了你，因为你还没有发布任何东西。如果您使用 bootstrap，只需使用 container-fluid 而不是容器 class。

对于 WooCommerce 中的完整网格，添加此 CSS 代码：

.woocommerce .content-area { width: 100% !important; margin: 0 !important;}

Woocommerce product catalog full width and title + price over image (overlay)