alt.hn

5/30/2026 at 1:43:02 PM

Using safe-area-inset to build mobile-safe layouts

https://polypane.app/blog/using-safe-area-inset-to-build-mobile-safe-layouts/

by eustoria

6/1/2026 at 1:54:45 AM

It'd be nice to see screenshots from real mobile browsers.

Currently, it is not possible to use viewport-fit=cover to show content under the status or address bars in iOS 26 Safari,[0] even though ironically Apple introduced it for the iPhone X.[1] viewport-fit=cover only has an effect when the site is added to the home screen, where like Android it determines whether the site can render under the home bar, but the status bar remains black.

[0]: Try this in iOS Safari: https://sheeptester.github.io/hello-world/test/100vh-cover.h... [1]: https://webkit.org/blog/7929/designing-websites-for-iphone-x...

by sheept

6/1/2026 at 6:33:53 AM

It works when the phone is in landscape mode.

I think the idea is that a site has no use for the status and address bars in portrait mode since the areas are already filled with controls.

by n_e

6/1/2026 at 4:11:56 AM

[dead]

by haeseong