W3C home > Mailing lists > Public > www-style@w3.org > January 2016

Re: [css-round-display] Non rectangular displays and the robustness of CSS

From: Jonathan Kingston <jonathan@jooped.co.uk>
Date: Wed, 13 Jan 2016 11:35:20 +0000
Message-ID: <CAKrjaaXyr2VywV8e3uaDr7JXZfD2x-caGYekTkxF-HPCnG-HDA@mail.gmail.com>
To: Shane Stephens <shans@google.com>, Florian Rivoal <florian@rivoal.net>, Alan Stearns <stearns@adobe.com>
Cc: www-style list <www-style@w3.org>
"Maybe on top of that we need to make it into a paged rather than
continuous medium to deal with block direction overflow from that shape?"

Pagination is certainly a lot more robust when it comes to round screens,
this works well for print media with minimum complete breakages of layout.
The problem with this approach for dynamic pages is that it would have to
follow a similar algo to how
https://drafts.csswg.org/css-overflow-3/#fragmentation works. By default
this would make pages very static like print media.

I'm also not sure how a site would transition from one display/packing algo
to another. Perhaps defining 'continuous/paged' should be something
viewport should be able to override the UA defaults:

@viewport {
  paging: continuous;
}

The browser then would be free to pick a mode it was in based upon the
screen, for example slightly rounded corners may decide to be continuous.

On Tue, Jan 12, 2016 at 9:00 PM Shane Stephens <shans@google.com> wrote:

> On Tue, Jan 12, 2016 at 2:22 PM Florian Rivoal <florian@rivoal.net> wrote:
>
>>
>> > On Jan 12, 2016, at 03:04, Alan Stearns <stearns@adobe.com> wrote:
>> >
>> > On 1/11/16, 5:51 AM, "Florian Rivoal" <florian@rivoal.net> wrote:
>> >
>> >>
>> >>> On Jan 11, 2016, at 18:32, Shane Stephens <shans@google.com> wrote:
>> >>>
>> >>> Perhaps a simple solution would be to require non-rectangular
>> displays to define a default rectangular view that can be overridden by new
>> round display primitives?
>> >>
>> >> Maybe. That said, on watches, the rectangular viewport that is small
>> enough to fit inside the circle (so that there's nothing hidden by the
>> corner) is so tiny I'm not sure that's practical.
>> >
>> > You can view everything in a rectangular view inside a circular display
>> as long as you can scroll all of the contents through the center of the
>> screen. Perhaps the default simple solution should be to extend the
>> scrollable area of the default rectangular view 50% of the screen height in
>> both the block-start and block-end directions?
>>
>> Right. That's also much simpler (which is good) than what I had in mind,
>> but I'm not sure:
>>
>> 1) Even if you can read the line in the middle, that's not a great
>> experience
>>
>> 2) On other-than-round non rectangular shapes, this may not be true (
>> http://jsbin.com/kunezu/edit?html,css,output). Yes this example may be
>> far-fetched, but the point is to get something that works *in environments
>> the author has not anticipated*.
>>
>
> This is why a device-specific maximal viewport rectangle approach works
> well.
>
> Taking your point of rectangular viewports being "so tiny" - by
> restricting ourselves to the maximal rectangle inside a circle, we're
> restricting ourselves to 2/π or ~64% of the total screen area.
>
> I'd argue that if you thought this square was too small to be useful,
> adding (a total of) half its size again in the form of four crescent shaped
> pieces attached to each edge isn't going to make much difference.
>
> Cheers,
>     -Shane
>
>
>>
>> 3) What property's initial value causes this to happen on shaped screens
>> but not on rectangular ones / how do you get rid of the over-scroll if you
>> have tailored to the screen shape? (i.e. how does it fit the model?)
>>
>>  - Florian
>
>
Received on Wednesday, 13 January 2016 11:35:59 UTC

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