How to calculate the maximum value for a border-radius without using percentage?

css

Solution

Why not use a percent?

border-radius: 50%;

Just make sure whatever you're applying it to is square.

Problem

CSS3 uses the `border-radius` attribute to set rounded corners in elements. The values, normally, are set in px, and the lowest value allowed is 0px. The visual result are variable, according to the dimensions of the element with this attribute. For example, an element with dimensions 100px X 100px with `border-radius: 20px;`, will not get totally rounded(circle), otherwise, an element with dimensions 10px X 10px will be. There are no limit to the maximum value allowed. The question is: how to calculate the maximum value, according to the element size, to make it 100% rounded? Fiddle page EDIT : How to calculate the value in pixels (px)?

Original source