NO BUG: border-radius on image + link or wrapper

Bricks Version: 1.4
Browser: Chrome Latest
OS: Windows 11

As per title, the border-radius applied to the image is fine, however, once a link is added or the HTML tag is changed from anything other than the default setting it loses the border radius:

How to replicate my instance:

Query Loop Card
Image (no div wrapper added) set to 100% height
Content Wrapper (absolute) with heading, category and terms inside.

You’ll likely just need to add overflow hidden. When you’re changing to a link, what you’re actually doing it wrapping it in a link, so now the border radius will be being applied to the link with the image having no border radius added.

Setting overflow hidden will ensure the contents inside will not be seen, and you’ll see the radius that has been added to the link.

just tested it - Loom | Free Screen & Video Recording Software

5 Likes

I was just about to write the same thing and can confirm that overflow hidden fixes the problem :+1:

2 Likes

Thank you @wplit & @lhirschm Very much appreciated!! :+1: