Responsive images - img w

Back to the index.

Responsive images-w.

Alt text

Image width is currently , layout viewport width is , and the image source is .

DPR is .

Saf/iOS 8 bug: first image always used

Multiple media queries

This is the way to use several media queries in one size. Note that there are no brackets around the entire media query system, just around the individual ones. Also, this does not work in Safari: it expects a single media query, apparently.

sizes="(max-width: 713px) 320px,
	(min-width: 713px) and (max-width: 873px) 480px,
	(min-width: 873px) and (max-width: 1033px) 640px,
	(min-width: 1033px) and (max-width: 1193px) 800px,