Question

图像上的链接被隐藏或覆盖，我无法弄清楚原因。下面的第一个<a href..就是一个例子..可以找到实时版本here ..基本上任何产品图片都应该是可点击的..

<div class="image-wrap">
    <a href="http://fundraisingfountain.pixelworklab.com/product/bull-dog/" title="Bull Dog">
        <img width="150" height="150" src="http://fundraisingfountain.pixelworklab.com/wp-content/uploads/2013/06/Pillow-Pets-Bulldog-2-150x150.png" class="attachment-shop_catalog wp-post-image" alt="Pillow Pets - Bulldog (2)">         
    </a>

    <ul class="product-details">
        <li class="details">
            <a class="button details" href="http://fundraisingfountain.pixelworklab.com/product/bull-dog/" title="Bull Dog">View Details</a>
        </li>
        <li class="price-wrap">
            <a href="http://fundraisingfountain.pixelworklab.com/product/bull-dog/" title="Bull Dog"><span class="price"><strong><span class="amount">$25</span></strong></span></a>
        </li>
        <li class="cart">
            <a href="/product-category/pillow-pets/?add-to-cart=164" rel="nofollow" data-product_id="164" data-product_sku="003" class="add_to_cart_button button product_type_simple">Add to cart</a>
        </li>
    </ul>
</div>

Answer 1

它在我的机器上运行良好。

你必须检查你的CSS并确保没有在它上面分层的div标签（或者具有比它更高的z-index）。

Answer 2

这是因为您设置了ul height:100%，这就是它与图像重叠的原因。

将height的{{1}}更改为更小的内容，并且可以正常使用

ul

woocommerce.css Line # 634

Answer 3

等等，如果你给出了

 border="0"

到您的图片链接周围没有灰色（或任何其他颜色）边框

Answer 4

以下是您需要修复的内容

ul.products li.product .product-details {
    height: auto;
    top: 108%;
}

ul.products li.product .product-details li {
    vertical-align: middle;
}

图像包装覆盖的链接

4 个答案: