← Back to release summary

CSS object-view-box

Category

CSS

Type

New or changed feature

Status

Enabled by default (Chrome 104)

Intent stage

Prepare to ship

Summary

object-view-box allows the author to specify a subset within an image that should draw within the content box of the target replaced element. This enables an author to create an image with a custom glow or shadow applied, with proper ink-overflow behavior like a CSS shadow would have.

Motivation

object-view-box and object-overflow allows the author to specify a subset within an image that should draw within the content box of the target replaced element. This enables an author to a create an image with a custom glow or shadow applied, with proper ink-overflow behavior like a CSS shadow would have.

Standards & signals

• Specification: https://drafts.csswg.org/css-images-4/#the-object-view-box
• Firefox: Positive
• Safari: No signal
• Web developers: Positive — This property is a pre-requisite for Shared Element Transitions which has positive feedback from developers : https://twitter.com/jaffathecake/status/1524782819431555074?t=itU6B0wo6SbjomGiSKLmGQ&s=19 Multiple customers who are excited about SET need this feature to achieve their desired UX, since their designs have visual overflows such as shadows.
• Tracking bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1303102

Explainers: https://github.com/w3c/csswg-drafts/issues/7058

View on chromestatus.com