This forum is now read-only. Please use our new forums! Go to forums

0 points
Submitted by Vasya Varl
over 7 years

Border-radius 50% or 100%

I tried to change the value of the border-radius and after 50 it isn’t changing, why?

Answer 55a019779113cb4d91000161

3 votes

Permalink

Anything more than the radius defaults to the actual radius. By definition a radius is the same in all directions, defining a circle. In other words, half of the diameter. 50%. The browser understands this.

Some authors choose to write 100%, but their reasoning is unclear, at least to me. It just seems to make the browser do more work calculating what the true radius is (in order to prevent curves from overlapping). Even if we use px units the diameter of the circle, the browser will calculate it down to half of that. For your own sanity, go with what seems most reasonable: 50%.

points
Submitted by Roy
over 7 years

Answer 55bca6cd9376766f290005d8

0 votes

Permalink

I agree with Roy on this. 50% should be used to make a circle. More info on this(which comes down to what Roy said): http://jessica-eldredge.com/2014/09/07/border-radius-50-or-100-percent/

points
Submitted by Ramon Onis
over 7 years