css - 如何使 Woocommerce 购物车表响应？

Question

我正在使用 WooCommerce，我正在尝试设计一个列出购物车页面上所有产品的表格，以便它变得响应式。但是，我一直遇到问题，现在我已经被困了几个小时，试图找出问题所在。我不能为那里的任何东西设置宽度。就像所有的 td 周围都有神奇的填充，因此我无法为表格设置 max-width: 100%;。

Here's a link to the problem (might be you have to add a product to the basket to see the issue)

感谢任何帮助:)

Answer 1

对于任何与 Woocommerce 有同样问题的人，即购物车页面表没有响应，这就是我修复它的方法:

.woocommerce table.cart th,
.woocommerce table.cart td,
.woocommerce #content table.cart th,
.woocommerce #content table.cart td,
.woocommerce-page table.cart th,
.woocommerce-page table.cart td,
.woocommerce-page #content table.cart th,
.woocommerce-page #content table.cart td,
.woocommerce table.shop_table th,
.woocommerce-page table.shop_table th,
.woocommerce table.shop_table td,
.woocommerce-page table.shop_table td {
    min-width: 30px;
}

出于某种我不太明白的原因，所有表格标题和表格数据都需要有一个 min-width。