0

I'm working on how to best fit the content around the iPhone notch with media-query orientation and contstants safe-area-inset-*.

It works well to be sure not to hide important UI under the notch, but it also give awkward results in landscape as the "unnotched" side is also concidered having a safe area gap and so unnecessarily pushing the UI to the center.

How can I detect not only the orientation, but also the direction (i.e. is the notch left or right) to apply spacial css on each cases?

Sébastien
  • 1,667
  • 3
  • 20
  • 31
  • Does this answer your question? [iPhoneX and Notch detection](https://stackoverflow.com/questions/47226824/iphonex-and-notch-detection) – biberman Apr 28 '21 at 12:04
  • I'd rather like a CSS only solution (similar to the media-query `orientation`), but I guess there are none... – Sébastien Apr 29 '21 at 08:46

0 Answers0