Skip to content

[css-env] border radius #6259

@mantou132

Description

@mantou132

In some operating systems (such as macOS), the browser has a rounded corner of the border. When the page content sets the border, need to adapt this rounded corner

Screen Shot 2021-05-01 at 10 25 56 PM

Proposal

Add safe-border-top-left-radius, safe-border-top-right-radius, safe-border-bottom-right-radius, safe-border-bottom-left-radius environment variables.

Example

body {
  border: 10px solid red;
  border-bottom-left-radius: env(safe-border-bottom-left-radius, 0);
  border-bottom-right-radius: env(safe-border-bottom-right-radius, 0);
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions