W3C home > Mailing lists > Public > www-style@w3.org > June 2015

[css-round-display] comments on CSS round

From: Jonathan Kingston <jonathan@jooped.com>
Date: Thu, 04 Jun 2015 00:10:34 +0000
Message-ID: <CAKrjaaWLjBZtxCWwOU3VLrdjkBv=xHa=GfPm0Zo8suwmeGoswA@mail.gmail.com>
To: www-style list <www-style@w3.org>
With new devices popping up all over now with different screens of shapes
and sizes would it make more sense for these changes to have further
clarity around different display shapes?

For example there are half moon shaped watches, oblong screens and also VR
headsets which use different shapes.

Issues for different screen shapes

   - No media queries for the different device profiles
   - Display is defined as circle(50% at 50%, 50%) in a regular round
   display further clarity would be needed around display shape.
   - Polar position doesn't always apply here
   - Some form of CSSOM shape interface for JavaScript would likely be
   needed.


Issues

   - Code example issue in Example 4

#container { #shape-inside: display; // the same as circle(50% at 50%, 50%)
in a regular round display }

This should likely just be shape-inside: display; without the #.


   - The Example 6 code is likely the wrong way around:

<div id="circle1" style="polar-angle: 0deg; polar-distance: 20%"></div> <div
id="circle2" style="polar-angle: 90deg; polar-distance: 50%"></div>

Polar distance should be swapped to be:

 <div id="circle1" style="polar-angle: 0deg; polar-distance: 50%"></div> <
div id="circle2" style="polar-angle: 90deg; polar-distance: 20%"></div>

To match the image provided.

I also thing due to the form factor of the device hit-testing becomes a far
more important issue:
http://discourse.specifiction.org/t/interactive-area-and-shape-outside/499

This was copied from the original thread at the request of Florian:
http://discourse.specifiction.org/t/css-round-display/790/3

Kind regards
Jonathan
Received on Thursday, 4 June 2015 00:11:14 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:54 UTC