- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Tue, 21 Jul 2009 16:14:02 -0500
- To: fantasai <fantasai.lists@inkedblade.net>
- Cc: Håkon Wium Lie <howcome@opera.com>, www-style@w3.org
On Tue, Jul 21, 2009 at 2:46 PM, fantasai<fantasai.lists@inkedblade.net> wrote: > Håkon Wium Lie wrote: >> >> I've run into an issue where the specification for border-radius seems >> more limiting than necessary. Consider this test case and screenshot: >> >> http://people.opera.com/howcome/2009/tests/border-radius7.html >> http://people.opera.com/howcome/2009/tests/border-radius7.png >> >> The top part of the screenshot shows how Opera's internal >> implementation renders the test case, the bottom in Firefox 3.5. >> >> I believe Firefox caps the radii as per the current specification [1] >> which states: >> >> The sum of two adjacent radii may not be more than the width or >> height (whichever is relevant) of the box. If any sum exceeds that >> value, all radii are reduced according to the following formula >> >> <nasty formula deleted> >> >> Opera, however, doesn't cap the radii but attempts to honor them. I >> can see many uses for the elliptic expressions that this behavior >> allows. The spec, instead, will leave us with many stadium-like >> borders, as can be seen in the two leftmost Firefox renditions. > > If you want an elliptic look, then set the two corner radii to two > different values. The goal of the formula is to preserve the shape > of the curve: if you want a different shape you should specify a > different shape. I'm with fantasai - I prefer that my corners respect the shape I set them to, even if that means they can't respect the *size* I set them to. As well, the formula only *looks* nasty because of the attempt to be compact and 'mathematical' - it's very simple if expressed in plain english. "For each side of the box, compare the length of the side with the combined length of the two radiuses on that side. If the combined radiuses are larger than the side length, divide the side length by the combined radius length. Once this has been done for all four sides, take the smallest such value and multiply all the radiuses by this factor." ~TJ
Received on Tuesday, 21 July 2009 21:15:01 UTC