Skip to content

[css-borders-4] Remove / in corner-*-shape grammars #11650

@cdoublev

Description

@cdoublev

The grammar of corner-*-shape shorthands requires using / to separate horizontal/vertical radii.

Name: corner-shape
Value: <corner-shape-value>{1,2} [ / <corner-shape-value>{1,2} ]?

Name: corner-top-shape, ...
Value: <corner-shape-value> [ / <corner-shape-value> ]

The corner-*-shape shorthands set the two corner-*-*-shape longhand properties of the related side. If values are given before and after the slash, then the values before the slash set the horizontal radius and the values after the slash set the vertical radius.

(nit: the second <corner-shape-value> in corner-<side>-shape should probably be optional).

But there is no horizontal/vertical definition of a corner shape like with border-radius. Is it an oversight? If so, I guess they should follow the same rules than margin, padding, right?

(edit, clarification) The canonical order of corner-shape longhands would be corner-top-left-shape, corner-top-right-shape, corner-bottom-right-shape, corner-bottom-left-shape.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions