[mediaqueries-5] Updating the CSS media feature syntax for foldable & dual-screen devices #5621
Description
My colleague @dlibby- and I had originally proposed spanning media feature with a set of enumerated values representing the layout viewport’s relationship to display hardware configuration (single-fold-vertical, single-fold-horizontal). The original thinking was that screen topologies of new hardware could be expressed by create more enumeration values.
The discussion on the previous issue, which provided a few suggestions. Based on those, we’d like the following (based on @fantasai 's proposal) to be considered as alternatives to the previous proposed media feature.
display-span-x: <integer[1,inf]>
display-span-y: <integer[1,inf]>
The values represent the number of logical displays the viewport spans in the specified direction. A logical display may represent a physical screens, or a more abstract concept like a display region for foldable devices that physically have a single screen. This can be extended to express the intent of the operating system window manager and be used in desktop scenarios as well.
These features are described based on their physical orientation relative to the upper left corner of the layout viewport in order to simplify authors’ reasoning about them, similar to other media features.
we'd like to gather consensus to add these to [mediaqueries-5] to allow Web developers to enhance content for dual-screen and foldable devices, while providing an syntax that can extend to cover multi-screen scenarios.
Example use-case:
