[csswg-drafts] [css-env] Add environment variable for left/right bounds of notch (#4721) from Amanda Baker via GitHub on 2020-01-31 (public-css-archive@w3.org from January 2020)

From: Amanda Baker via GitHub <sysbot+gh@w3.org>
Date: Fri, 31 Jan 2020 03:22:14 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-557888595-1580440933-sysbot+gh@w3.org>

amandabaker has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-env] Add environment variable for left/right bounds of notch ==
[CSS Environment Variables](https://drafts.csswg.org/css-env-1/)

On mobile devices with notches, developers can use the `safe-area-inset-*` environment variable to shift the web content and ensure that all content is hidden behind the notch. However, with limited space on small devices, developers want to be able to place content in the area next to the notch as well.

Proposal:
Introduce two new CSS environment variables: `safe-area-inset-inline-start` and `safe-area-inset-inline-end`.  Developers can then combine these with the existing `safe-area-inset-*` variables to fill in the rest of the space l

![safe-area-inset-top](https://user-images.githubusercontent.com/8602218/73509998-c99e3c00-4395-11ea-9968-89e9ffe4b9b1.png)
![safe-area-inset-left](https://user-images.githubusercontent.com/8602218/73510002-cc009600-4395-11ea-9a5a-56e7b1d0028c.png)



Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4721 using your GitHub account

Received on Friday, 31 January 2020 03:22:16 UTC