Background Overlay doesn't follow border radius
Hi, when I add a background overlay to a wrapper with a border-radius, it doesn't respect the border-radius that is set. How can I get the background overlay to have the border radius?
See screen recording of example: https://vimeo.com/747466850
Comments
Hello,
Sorry, but link you sent is not working.
Please always attach a link to your website so we can check it out. If the page is offline(localhost), then our help will be limited. You will have to contact us when the page is online. Also, please make sure that the page is not under maintenance before you provide us with the link.
Thanks
Please try the link again, it was set to private.
Can you send us a link to your website? I'll customize for you using the CSS code.
thanks
Could you let me know what CSS to use? I tried using the class for the overlay from the developer console but nothing I tried worked.
Link to site: https://diversityhealthcarefl.com/
You can see in the attached screenshot of the home page that the overlay is not rounded on the left. The reason the overlay is not showing on the right corners is because the overlay is a gradient with the right side being 0% opacity.
Hi,
Please, use the following CSS code:
.mcb-section-e533d260c .mcb-background-overlay{ border-radius: 30px!important; }Put it in Betheme -> Theme options -> Custom CSS & JS -> CSS.
Thanks
Awesome, that worked!