[css4-background] border-top-radius etc

It's incredibly common that authors need to specify both the top-left and top-right border radii or both the bottom-right and bottom-left corners etc (think of tabs, split buttons and other common UI elements). In these cases, they have to do something like:

border-top-left-radius: .5em;
border-top-right-radius: .5em;

which is not too bad, but is repetitive. Instead, it would be much better if we could use the following shorthands:

border-top-radius
border-right-radius
border-bottom-radius
border-left-radius

Which would accept values with the following syntax:

[ <length> | <percentage> ]{1,2} [ / [ <length> | <percentage> ]{1,2} ]?

i.e. like border-radius, but with less values.

Thoughts?

Lea Verou
W3C developer relations
http://w3.org/people/all#leahttp://lea.verou.me ✿ @leaverou

Received on Friday, 12 October 2012 01:51:15 UTC