Skip to content

[css-shapes-1] Proposal: Option for the radii of round on <basic-shape-rect> to resolve percentages against the rectangle itself instead of the reference box #12598

@bernhardf-ro

Description

@bernhardf-ro

The border radii specified after the round identifier of <basic-shape-rect> functions resolve percentage values against the reference box.

However, in many cases authors prefer radius percentages to be resolved against the rectangle itself, i.e. the dimensions computed from the <basic-shape-rect> function.

We propose an additional or alternative identifier that changes how those percentages are resolved.

We are not yet sure about good names, so we will go with self and round-self for the following examples.

For example, the following would create border radii that are always about a third of the related side of the rectangle, leaving the remaining middle third of each side straight, regardless of the font-size, and with it the resolved em values:

xywh(10mm 5mm 4em 3em round self 33%) /* additional identifier */
xywh(10mm 5mm 4em 3em round-self 33%) /* alternative identifier */

Of course em values are not a common case. But even with absolute lengths, such percentages are easier to read and understand for authors and maintainers.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    Status

    Wednesday Morning

    Status

    Agenda+

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions