Hello, Pablo!
In my project, when applying a warp, the rounded corners of the image turn into sharp corners when hovering over the mouse. This feature is also visible in the template https://wysiwygwebbuilder.com/support/w ... ndon.html
In the "Shop for Unique Holiday Gifts" section.
It seems to me that the rounded corners should still remain when hovering the mouse, otherwise it turns out to be somehow illogical.
That is, the border should be a kind of mask, and not the edge of the image, which disappears when hovering the mouse.
If this cannot be fixed, then how can rounded corners be preserved?
CSS code "overflow: hidden" doesn't work, custom image style doesn't work either…
Link to project: https://drive.google.com/file/d/1r2OTGn ... p=sharing
Please advise the solution if!
The rounded edges of the image disappear
Forum rules
IMPORTANT NOTE!!
DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.
PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
IMPORTANT NOTE!!
DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.
PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
Re: The rounded edges of the image disappear
Rounded corners is not a mask. It's standard HTML feature border-radius which is applied to the image.
When you use the zoom effect then the image is scaled and therefor the rounded corners fall outside the view area.
The reason why the border-radius is not applied to the image's container is because then the corners would not be visible if you use max-width.
When you use the zoom effect then the image is scaled and therefor the rounded corners fall outside the view area.
The reason why the border-radius is not applied to the image's container is because then the corners would not be visible if you use max-width.
Re: The rounded edges of the image disappear
Thanks for the clarifications!
- wwonderfull
-
- Posts: 1555
- Joined: Fri Aug 21, 2020 8:27 am
- Contact:
Re: The rounded edges of the image disappear
@VictorKrs I think I checked the html structure of it and with a bit of custom codes it could be possible. It is happening because the container itself does not have the radius which is the reason the overflow comes full on the corner.
I have sent a solution to your email check and see if it works for now.
Re: The rounded edges of the image disappear
Now that's a champion!wwonderfull wrote: ↑Tue Feb 04, 2025 11:34 am@VictorKrs I think I checked the html structure of it and with a bit of custom codes it could be possible. It is happening because the container itself does not have the radius which is the reason the overflow comes full on the corner.
I have sent a solution to your email check and see if it works for now.
// Love is the acceptance of nothing / Account age is no guarantee of efficiency ;-) ->
Above, Beyond, and @wwonderfull! <- Genuinely helps you with a powered up site that counts! Four Times Excellence!
Above, Beyond, and @wwonderfull! <- Genuinely helps you with a powered up site that counts! Four Times Excellence!
- BaconFries
-
- Posts: 5867
- Joined: Thu Aug 16, 2007 7:32 pm
Re: The rounded edges of the image disappear
I saw that reply coming it was written in the card's (tarot)Now that's a champion!
Re: The rounded edges of the image disappear
Dear, wonderful! I join the assessment of @jerryco, and I finish myself off - you are a superherowwonderfull wrote: ↑Tue Feb 04, 2025 11:34 am@VictorKrs I think I checked the html structure of it and with a bit of custom codes it could be possible. It is happening because the container itself does not have the radius which is the reason the overflow comes full on the corner.
I have sent a solution to your email check and see if it works for now.

That's what it means - "knowledge is power"!
Thank you sincerely for your help in solving the issue!
I think your solution will be useful not only to me, but also to other users who like to hide the corners of elements (how good it was when there was a fashion for sharp corners in design
