Using safe-area-inset to build mobile-safe layouts | Polypane
Modern phones are not simple rectangles. They have rounded corners, camera cutouts, dynamic islands, and home indicators that double as gesture areas.
Browsers by default will prevent your site from being obscured by the notch or home indicator, so your content will be safe without any special handling. That does come with a downside, which is that the browser will give you a smaller viewport to reserve space:
June 8, 2026 at 1:43:10 PM EDT
*
FILLER