1

How do I round the corners on my Better Image?

border-radius is your friend

Bob

Last Update hace 8 meses

The default CSS of a Better Image includes overflow: visible, which is great to show Captions exploding out from the image, and for the Magnify lens to escape the bounds of the image when magnifying it.


However, if you want to apply a border-radius to your Better Image, you will also need overflow: hidden for it to work.


Here's the CSS we use on our site for the rounded corners effect: 

If you are using Elementor on WordPress, for example, you can add this as Custom CSS on Page Settings / Advanced:

Note: "cqw" is a CSS unit relative to the width of the image container, so the corners are responsive on all devices, up to a maximum of 32px. cqw is a relatively new CSS unit, so we also include the fallback of 16px for older browsers.

Was this article helpful?

1 out of 1 liked this article

Still need help? Message Us