【问题标题】:woocommerce reduce space between image and detailswoocommerce 减少图像和细节之间的空间
【发布时间】:2018-10-10 20:28:51
【问题描述】:

我的产品页面在图片和产品详细信息之间的中间有大量空白。请问我如何减少这个空间?我不确定是哪位代码控制了这一点。

请在此处查看我的页面 - https://flowersforeveryone.feedmybeta.com/product/precious-pink-tulips/

提前感谢您的帮助!

【问题讨论】:

  • .woocommerce-page div.product div.summary {width: 50%;}
  • 寻求代码帮助的问题必须包括在问题本身中重现它所需的最短代码,最好是在堆栈片段中。尽管您提供了一个链接,但如果它变得无效,那么您的问题对于未来遇到同样问题的其他 SO 用户将毫无价值。见Something in my website/demo doesn't work can I just paste a link
  • 抱歉,我不确定控制容器的代码是什么,但我更改为使图像更小的代码是 - .woocommerce div.product div.images.woocommerce-product-gallery {宽度:40%; }

标签: css wordpress woocommerce


【解决方案1】:

https://i.imgur.com/6jamXAx.png

去掉宽度或者你可以width: 60%

【讨论】:

  • 太棒了..谢谢!唯一的问题是现在产品细节中的一些元素(水平线和添加到购物车按钮)现在超宽。我会改变什么来保持这些原始宽度?我实际上想将所有内容都放在页面中心
  • 然后你可以在右边的块中添加边距。但是由于您的网站是全宽的,因此右边距不会给您带来更好的外观。
  • 很酷,谢谢。我通过减小添加到购物车按钮和线条的宽度来解决问题