stevec
stevec

Reputation: 52598

Make a rounded bootstrap container or image more 'rounded' i.e. increase roundedness?

I followed instructions here to make the corners of each image in a grid 'rounded', it it worked as expected (see screenshot below)

But I would prefer the rounded corners to be a little more pronounced, as indicated roughly with the green line in the screenshot. How can this be done?

enter image description here

The current code I'm using is

<img class="rounded" src="img.png">

Upvotes: 1

Views: 2460

Answers (1)

Carol Skelly
Carol Skelly

Reputation: 362700

Bootstrap 4 has a rounded-lg class which sets border-radius: .3rem.

If you want more radius than that override it with your own CSS class...

.rounded-xl {
   border-radius: .5rem;
}

Demo

Bootstrap 5 has 3 numeric sizes.

Upvotes: 2

Related Questions