How to add rounded corners to an image using the Elementor editor

Question

This drives me crazy. I have an image in a textbox on a simple Elementor page. It sits nicely inside the "Text Editor Widget" and I want to add rounded corners to it. I created a CSS class in "Site Settings/Custom CSS" and then assigned the image to that class in the image editor in the text editor. .AZ-rounded-image{border-radius:15px;} but nothing happens... Can anyone help - I wasted three hours on this... Thanks a lot Andy

P粉312631645 · Answer

Have you tried setting overflow to hidden? Does it display like below? By default overflow is visible, so if the content of .AZ-rounded-image is larger, it will overflow, making border-radiusInvisible.

.AZ-rounded-image { 
    border-radius: 15px;
    overflow: hidden;
}