Can't fix iPhone X safe area padding issue

TimFL

Member
Affected version
2.0.1
Hello,

on the iPhone X there are a few safe areas website developers have to account for. For one the space at the bottom is often used for interactive elements. These often clash with the home bar on the iPhone X. If you, for example, post a new topic the Post/Preview buttons on the floating bar on the bottom interfere with the home bar.
Example (in the horribly drawn red circle):
B5875E21-33F1-451A-AD9A-01DF55B1FB44.webp

A guide on safe areas can be found here: https://webkit.org/blog/7929/designing-websites-for-iphone-x/
 
Unfortunately we're unable to fix this until this is implemented:

https://xenforo.com/community/threads/iphone-x-landscape-optimization.141624/

The environment variables for the safe-inset area only apply when viewport-fit is set to cover. We can only set that if/when we fully support the other changes required to support the iPhone X.

With this in mind, we can't fix this right now and we will look at it in the future if the suggestion is implemented.
 
Top Bottom