Overflow:hidden not working

Hello,

I made a little style effect so when you mouse over a product image, the image is zooming and a little green bar appears under the pciture.
My problem is that want the zoom having the same dimension than the original picture, and hide the overflow.

url: [ redundant link removed ]

Here’s the css code I used:

.wc-block-grid__products .wc-block-grid__product-image img{
	overflow:hidden;
}
.wc-block-grid__products .wc-block-grid__product-image img:hover{
    transform: scale(1.05);
    transition: 0.5s;
}
.wc-block-grid__products .wc-block-grid__product-image img {
    border-bottom:4px solid transparent;
}
.wc-block-grid__products .wc-block-grid__product-image img:hover{
	border-bottom:4px solid #47ff66;
}

Any idea how to fix that?
Thanks

• This topic was modified 2 years, 4 months ago by Jan Dembowski.

The page I need help with: [log in to see the link]