Adds two CSS features. The 'clip' value results in a box’s content being clipped to the box's overflow clip edge. In addition, no scrolling interface is provided, and the content can not be scrolled by the user or programmatically. The overflow-clip-margin property enables specifying how far outside the bounds an element is allowed to paint before being clipped.

Motivation

overflow: clip enables developers to disallow any type of scrolling for the box, including programmatic scrolling. Additionally the box is not considered a scroll container, does not start a new formatting context, and allows the clipping to apply to a single axis via overflow-x and overflow-y. overflow-clip-margin allows the developer to expand the clip border. This is particularly useful for cases where there is ink overflow that should be visible. Part of the CSS working draft, and Firefox is shipping it soon: https://groups.google.com/g/mozilla.dev.platform/c/7oQm8PC0aU0 .

Documentation

• https://drafts.csswg.org/css-overflow-3/#valdef-overflow-clip
• https://drafts.csswg.org/css-overflow-3/#propdef-overflow-clip-margin

Specification

Specification link

Status: Specification being incubated in a Community Group

Status in Chromium

Blink components: Blink>Layout

Implementation status: Enabled by default (tracking bug)

Consensus & Standardization

• Firefox: Shipped/Shipping
• Safari: Positive
• Web Developers: No signals

Owner

• sky@google.com

Last updated on 2021-07-26