← Back to release summary

safe-area-max-inset-* variables

Category
CSS
Type
New or changed feature
Status
Enabled by default (Chrome 135)
Intent stage
None

Summary

In https://chromestatus.com/feature/5174306712322048 we've added dynamic safe area insets which can change as the user interacts with the device. This proposal amends the general safe area feature to add max-area-safe-inset-* variants of the variables which do not change and represent the maximum possible safe area inset. The use case this solves is to avoid needing to relayout the page in cases where the footer (for example) can simply slide as the safe area inset value grows, as opposed to changing size.

Motivation

This feature extends dynamic safe area insets (https://chromestatus.com/feature/5174306712322048) by providing a static safe-area-max-inset-* set of properties. These properties are static and represent the max value for the dynamic properties. It allows developers to create effects where the bottom bar slides instead of growing while remaining composited.

Standards & signals

View on chromestatus.com