Safe area
The part of a phone screen not covered by a notch, a rounded corner, a status bar or a home indicator, which the page must be told to respect.
Near it
What it is made of
| what it is | env(safe-area-inset-top / right / bottom / left), the space a notch, a rounded corner or a home indicator takes out of the viewport | |
| and it needs viewport-fit=cover to report anything at all | without it the browser insets the viewport itself and every env() reads 0 | |
| measured on our own site, and the measurement is a nil | env(safe-area-inset-*) appears ZERO times in ink.css, which is the whole of this site's CSS | measured on ink.css, which is the whole of this site's CSS: one stylesheet, 95 rules, 2 media queries. This entry is therefore describing the thing and not our use of it, and the nil is written down rather than left as an absence somebody would have to notice |
Margin
Breakpoint
Responsive