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