yavg
yavg

Reputation: 3061

How to apply the "rounded-circle" in css? border-radius:50% not works

Apparently it seems easy, I use Bootstrap and in fact I am applying the "rounded-circle" class but nothing happens. basically to make the effect that the image becomes a circle the attribute is used: border-radius: 50%! important; But I don't know why it doesn't apply correctly.

img{
border-radius:50%;
width:300px;
height:300px;
}
<img src="https://luisjordan.net/wp-content/uploads/2017/04/logo-ionic.jpg">

Upvotes: 0

Views: 428

Answers (1)

Jos&#233;
Jos&#233;

Reputation: 91

You could simply try an image with a dark background or simply add a border to see how round the image with a white background

img{
  border-radius:50%;
  width:300px;
  height:300px;
  border: solid 1px black;
}
<img src="https://csform.com/wp-content/uploads/2018/06/Ionic-App-Dark-UI.jpg">

<img src="https://luisjordan.net/wp-content/uploads/2017/04/logo-ionic.jpg">

Upvotes: 3

Related Questions