Re: [css-device-adapt] MSFT feedback on latest editor's draft

Hi there,

1. device-width and device-height are being replaced by 100% or 100vw/vh.

Kenneth

On Mon, Dec 9, 2013 at 9:49 PM, Matt Rakow <marakow@microsoft.com> wrote:
> Hi all,
>
> I've been getting caught up recently on the edits made to the Device Adaptation ED and wanted to provide some feedback.
>
> 1. Explicit values for initial viewport width and height
> In the latest ED the named values of "device-width" and "device-height" have been removed, and instead declaring a width or height of "auto" is intended to provide equivalent behavior.  However, "auto" is already the default value, indicating that the UA's default behavior may apply - the behavior just changes if you explicitly set the width or height to "auto".
>
> IE uses "auto" to reflect the default behavior of the browser (i.e. actual viewport is minimum 1024px by default), whereas "device-width" and "device-height" map to the dimensions of the initial viewport (matching the current WD).  I'd like to add the named values back so we can keep these concepts distinct, and so that "auto" only has a single meaning.
>
> I agree that device-width/device-height are probably not the right vocabulary to use though.  Perhaps a renaming would be appropriate ("initial-viewport-width"?  "window-width"?  "css-pixel-width"?).
>
>
> 2. min- and max- width and height
> Currently, there are two ways to provide a viewport "range."  These are the min- and max- prefixes for the width and height properties, and the interaction of @viewport with width and height media queries.  Having both of these mechanisms adds a pretty significant amount of complexity to the ways this feature can be applied, especially if both are used simultaneously.
>
> I'd argue that the min- and max- prefixes for the width and height properties are not necessary for the scenarios developers are interested in, and that equivalent functionality can be built using only media queries for range constraints.  For example, consider the two following rules:
>
> /* Example A */
> @viewport {
>     min-width: 640px;
>     max-width: 960px;
> }
>
> /* Example B */
> @media (min-width: 640px) and (max-width: 960px) {
>     @viewport { width: device-width; }
> }
>
> Both of these rules suggest the author has done the work necessary to ensure their site works well for widths between 640 and 960px, and both are equivalent for initial viewports within that range.  However, outside of that range the behavior differs.  The primary difference is that Example A forces scaling for all window sizes outside of the designed-for range, while Example B leaves the UA in charge of what happens to those sizes.  I see Example B as the better option, as the potentially unbounded scaling of Example A will likely end up with an unintended result for extreme viewport sizes.  Consider the ~200% scaling that would occur on a 1080p monitor, for example.
>
> I'd be interested in removing the min/max option from the spec, if there is not a particular scenario they are required for.
>
> Thanks,
> -Matt
>
>



-- 
Kenneth Rohde Christiansen
Web Platform Architect, Intel Corporation.
Phone  +45 4294 9458 ﹆﹆﹆

Received on Monday, 9 December 2013 20:55:45 UTC