W3C home > Mailing lists > Public > public-css-archive@w3.org > February 2019

Re: [csswg-drafts] [css-media-queries] Orientation does not respect soft keyboard on mobile devices (#3587)

From: jonjohnjohnson via GitHub <sysbot+gh@w3.org>
Date: Sat, 02 Feb 2019 17:01:14 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-459980851-1549126873-sysbot+gh@w3.org>
Keep in mind we have https://drafts.csswg.org/mediaqueries-4/#device-aspect-ratio which already covers a `device-orientation`. Simply `min-device-aspect-ratio: 1/1` for landscape & `max-device-aspect-ratio: 1/1` for portrait. Or if you don't want the "square" cutoff, use any ratio you find better fits your interface. The `orientation` MQ is just a shorthand for the fuller `aspect-ratio` MQ.

@quasicomputational I think your question is exactly what the OP is concerned about. Touch implementations of `orientation` often already change when soft keyboards open/close. https://stackoverflow.com/questions/8883163/css-media-query-soft-keyboard-breaks-css-orientation-rules-alternative-solut

This is sadly a place where media queries cross with the compat around visual and layout viewport. Sometimes I want an MQ that matches the application of soft keyboards, sometimes I don't. Embedded browser projects, like cordova even have work arounds for this lack.

- https://medium.com/samsung-internet-dev/toolbars-keyboards-and-the-viewports-10abcc6c3769
- https://developers.google.com/web/updates/2017/09/visual-viewport-api

And on top of visual and layout viewport issues, the `device` MQ doesn't nail it when we have iOS Split View and general multitasking interfaces where viewports don't match the devices dimensions anyway. 

GitHub Notification of comment by jonjohnjohnson
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3587#issuecomment-459980851 using your GitHub account
Received on Saturday, 2 February 2019 17:01:16 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:43 UTC