图片标签导致Woocommerce产品大拇指看起来混乱

为了显示适当的葡萄酒图标奖，我在我的woocommerce商店下安装了一个插件。当我添加woocommerce东西图像的左上角显示的图像图标，并且在移动网站上看网站时，图像看起来无序并且像它被挤压和伸展。如果你从手机看网站主页http://letmewine.com/和产品“FRANCIACORTA BRUT”ALMA“BELLAVISTA”，你会明白我的意思。我试着将z-index值的位置分配给绝对或相对于该图像的图标，并且什么也没有发生。我可以使用任何建议在这里做什么。图片标签导致Woocommerce产品大拇指看起来混乱

非常感谢帮助

来源

2016-11-14 DigitalWhirl LLC

的问题是，你的形象是绝对的，并且已经设置width:100%，height:100%这使得被拉伸。这是因为图像试图填充实际上比图像尺寸大的整个支架。

你应该改变你的style.css上线11739其中，是图像（.post_featured img）选择和改变，因此您的代码将变为：

.post_featured img { 
    width: auto; 
    height: auto; 
}

来源

2016-11-17 06:45:55

感谢的建议，它的工作，但某些部分。如果你现在检查它。该图像似乎被切成一半高度。我怎样才能避免这一点？ –

那么现在的问题是，当为高度属性添加'！important'时，图像的另一种风格被您覆盖。您应该删除'！important'语句，并将其保留在我的示例中。 –

太棒了，它的工作！ –

图片标签导致Woocommerce产品大拇指看起来混乱

回答

相关问题