[whatwg] Problems with width/height descriptors in srcset

Tab Atkins Jr. jackalmage at gmail.com
Thu May 17 17:03:38 PDT 2012

On Thu, May 17, 2012 at 11:42 AM, Kornel Lesiński <kornel at geekhood.net> wrote:
> On Thu, 17 May 2012 19:15:36 +0100, Matthew Wilcox <mail at matthewwilcox.com>
> wrote:
>> I also agree with Tab and Jeremy on this one - that makes a lot more
>> sense to me and removes any ambiguity without being overly verbose.
> I like the less-compressed, more CSSy syntax as well.
> I have two concerns though:
> Is any media query allowed?
> If so, then use of "min-device-pixel-ratio:2x" would give inferior results
> to using the "2x" multiplier, because 2x allows UA to choose when the 2x
> image is selected (taking into account bandwidth, zoom, user preference,
> etc.), but min-device-pixel-ratio is supposed to query a fact about the
> device, not a preference. Should that be discouraged, or maybe even
> special-cased as an alias of "2x" descriptor?

These aren't *really* media queries, they just act a whole lot like
them.  (They can be ignored if needed.)

So no, we should just have a specific set of things that are allowed.

> How do scaling factors and size queries interact?
> When only scaling factors are specified then selection is easy, and images
> could be described in any order:
> <img srcset="imgA 1x, imgB 2x">
> <img srcset="imgB 2x, imgA 1x">
> If "first one that matches" rule was applied to density descriptors, then
> this would surprisingly fail:
> <img srcset="imgA 1x, imgB 2x">
> because a 2x screen can display 1x image (or the opposite case would fail
> depending how you define matching of density).

The spec makes this clear - after filtering the list based on
width/height descriptors, the UA can choose whatever density it wants,
based on whatever algorithm it wants.  Ordering makes no difference.

(Ordering makes no difference in width/height either, for that matter.)

> As soon as sizes are specified, taking into account order of the rules
> becomes unavoidable:
> <img srcset="imgA min-height:100px, imgB min-width:100px">
> on a screen that is larger than 100x100 both would match, so there needs to
> be some definition which one wins, e.g. the first one that matches.

The spec has such a definition.  I can't recall what it is off the top
of my head.


More information about the whatwg mailing list