iPhone X / 8 / 8 Plus CSS media queries

Question

What are the CSS media queries corresponding to Apple\'s new devices ? I need to set the body\'s background-color to change the X\'s safe area back

Answer 1

It seems that the most accurate (and seamless) method of adding the padding for iPhone X/8 using env()...

padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);

Here's a link describing this:

https://css-tricks.com/the-notch-and-css/