Border-radius: 22.5%; is equivilant to what in px?

How do you figure out the number?


.one {
  border-radius: 22.5%;

.two {
  border-radius: 50px;


<img class="one" src="">

<img class="two" src="">

A border-radius with a percent value will vary based on the size of the element. It is a percentage of the length of the side. For example, using border-radius: 50% will result in a circle or oval, no matter what size the image is.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.