Badges are not aligned with image

Hello,

You can add some Css command in your Frontend file Css, see this tutorial to see how to proceed.
Hope this will help you to move forward.
Regards

Hi,

Could you provide a screenshot of the settings of your badge so that we can get a better understanding of the situation ?

Hi,

I think that you want to turn off the "keep size" setting of your badge.
With the option activated the badge image will always have the same size regardless of the size of the product image.
With the option turned off, the badge image size will adapt based on the size of the product image.

Hi,

Did you enter a percentage below the "keep size" option ?
Otherwise, the system won't know how to resize the badge.

Hi,

Here, you can see that the badge is aligned with the image below:
monosnap.com/file/WsMxJa2ImIL6pcdDfVQtanmheR6SCL
The blue square is the area taken by the image.

And here you can see the same with a smaller screen :
monosnap.com/file/QLu24Bs17kZP6M8XCvaHwvEEIxQanO
As you can see, the badge is still correctly aligned with the area taken by the image.

So as far as I can see the problem on the listing with the badge going over the area of the product box is not a badge issue. It's that the thumbnails size you set for the listing is a bit too big in regard to the margin you set around the product boxes and the number of columns of the listing and the CSS which switch to 1 column mode.
With three columns and the margins you set, you only have a width of 292px available for your product thumbnails. So you should change that in the settings of your menu items and it should then display better.