title: Correct srcset sizes media query pattern order
body: <p>Both of the following srcset+sizes combos result in chrome loading the bigger (2560px) image under any resolution (1920,1440...) according to devtools network tab. Resolutions are simulated via device toolbar, DPR:1.0, Desktop.</p>
  <p>I am using private navigation, just in case.</p>
  <pre><code>&lt;img 
      srcset=&quot;
          http://path/to/images/26b-dsc01175-375x.jpg 375w,
          http://path/to/images/26b-dsc01175-720x.jpg 720w, 
          http://path/to/images/26b-dsc01175-960x.jpg 960w, 
          http://path/to/images/26b-dsc01175-1280x.jpg 1280w, 
          http://path/to/images/26b-dsc01175-2560x.jpg 2560w&quot; 
      sizes=&quot; 
          (max-width: 375px) 375px, 
          (max-width: 1440px) 720px, 
          (max-width: 1920px) 960px, 
          (max-width: 2560px) 1280px,
          2560px&quot; 
      src=&quot;http://path/to/images/26b-dsc01175-960x.jpg&quot;
  &gt;
  </code></pre>
  <pre><code>&lt;img 
      srcset=&quot;
          http://path/to/images/26b-dsc01175-375x.jpg 375w,
          http://path/to/images/26b-dsc01175-720x.jpg 720w, 
          http://path/to/images/26b-dsc01175-960x.jpg 960w, 
          http://path/to/images/26b-dsc01175-1280x.jpg 1280w, 
          http://path/to/images/26b-dsc01175-2560x.jpg 2560w&quot; 
      sizes=&quot;  
          (min-width: 2560px) 1280px,
          (min-width: 1920px) 960px, 
          (min-width: 1440px) 720px, 
          (min-width: 720px) 720px,
          375px&quot; 
      src=&quot;http://path/to/images/26b-dsc01175-960x.jpg&quot;
  </code></pre>
  <p>Both assume that, in sizes, the first media query to match is the one used, and the rest ignored.</p>
  <p>For example, the following code:</p>
  <pre><code>&lt;img 
      srcset=&quot;
          http://path/to/images/26b-dsc01175-375x.jpg 375w,
          http://path/to/images/26b-dsc01175-720x.jpg 720w, 
          http://path/to/images/26b-dsc01175-960x.jpg 960w, 
          http://path/to/images/26b-dsc01175-1280x.jpg 1280w, 
          http://path/to/images/26b-dsc01175-2560x.jpg 2560w&quot; 
      sizes=&quot; 
          (min-width: 375px) 375px, 
          (min-width: 1440px) 720px, 
          (min-width: 1920px) 960px, 
          (min-width: 2560px) 1280px,
          2560px&quot; 
      src=&quot;http://path/to/images/26b-dsc01175-960x.jpg&quot;
  &gt;
  </code></pre>
  <p>...results in the smallest (375px) image being loaded, as expected, under 1920,1440... Because, as far as I understand, the first media query in sizes matches those resolutions, and so it does not advance to the next queries.</p>
  <p>Are both of them wrong? Should be min-width on the first and max-width on the second ? Opposite order ?</p>
  <p>Thank you</p>