为什么我的产品不会环绕我的图像？我需要它们环绕我的浮动图像答案

【问题标题】：Why won't my products li wrap around my image? I need them to wrap around my floated image为什么我的产品不会环绕我的图像？我需要它们环绕我的浮动图像
【发布时间】：2015-06-02 03:00:59
【问题描述】：

提前感谢您的帮助，这让我想把我的电脑扔到房间的另一边！我不明白为什么我的 ul 产品 li 没有环绕我添加的图像。我认为这将是一个 CSS 解决方案，但以防万一，这是我在 php 中所做的：

在我的 archive-product.php 文件中我添加了：

    <?php if ( is_product_category() ) {
      if ( is_product_category( 'cubicles' ) ) {
      echo '<div class="cubicles"><img src="/wp-content/uploads/2015/05/menu_cubicles.jpg"></div>';
     } ?>

附加的样式是：

     body.archive .cubicles { 
        height: 347px;
        width: 220px; 
        float: right; 
        margin-right:0;
     }

这是实时链接：http://dev.arnoldsofficefurniture.com/product-category/cubicles

由于它是向右浮动的，而 ul 产品 li 是向左浮动的，我不明白为什么它们不包装。如果它们的高度相同，我也不明白为什么 li 没有始终排成一行并被推倒。提前致谢！

【问题讨论】：

寻求调试帮助的问题（“为什么这段代码不起作用？”）必须在问题本身中包含所需的行为、特定问题或错误以及重现它所需的最短代码。见How to create a Minimal, Complete, and Verifiable example
嗨 Paulie_D - 我在问题中添加了“我需要它们环绕我的浮动图像”。可以吗？
我们可以用问题中的代码重现问题吗？不？那么这就是我们需要的。如果您的开发链接消失了，它对未来的用户将毫无用处。
抱歉，如果您觉得这不是我的本意，但我最初的评论已经说明了一切……这是对提出问题的 Stack Overflow 指南的直接引用。
@antu 您是否意识到您提到在li 中包装图像时遇到问题，但您的代码示例甚至没有li？如果您展示的只是一些 php if 语句和不稳定的 css，您希望人们能帮助您做什么？

标签： php css wordpress woocommerce

【解决方案1】：

它没有掉到小隔间下面的原因是没有足够的空间。产品的整个区域为 975px 宽。每个产品列表项为 220px 加上 30px 右边距。简单的数学运算... 250 * 4 = 1000。如果您移除隔间，每行仍然只有三个产品。

你需要修改你的宽度/边距来修复它。

【讨论】：

我删除了隔间图片，每行有 4 个，和以前一样。我不知道为什么，但以前是这样，现在又是这样。我想我会放弃整个想法并尝试另一种方式。不过，我非常感谢大家的意见，以供将来参考！