CODEWITHSUNDEEP
wordpresswoocommercewordpress-theming
Boris Zegarac
Boris Zegarac

Reputation: 531

Image tag cause product thumb look disorder in Woocommerce

I have installed one plugin under my woocommerce store in order to show appropriate icon awards for wines. When I add image icon which shows in top left corner of woocommerce thing images, and look website on mobile website the image looks disorder and like its squeezed and stretched. If you take a look at website home page http://letmewine.com/ and product "FRANCIACORTA BRUT “ALMA” BELLAVISTA" from mobile phone you will see what I mean. I tried assigning z-index value position to absolute or relative to that image icon and nothing happend. I could use any suggestion what to do here.

Thanks a lot for help

Upvotes: 1

Views: 148

Answers (1)

Stanimir Stoyanov
Stanimir Stoyanov

Reputation: 1916

The problem is that your image is absolute and have set width:100%, height:100% which makes is stretched. It's because the images is trying to fill the the entire holder which is actually bigger than image size.

You should change your style.css on line 11739 where is the selector for the image ( .post_featured img ) and change so your code will become:

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

Upvotes: 2

Related Questions