HTML5 Picture element does not seem to be supported by Chrome 52? Srcset not working

Question

I just started a new webpage so there's not much markup to go over.

I set this down:

<picture>
    <source media="(min-width: 1000px)"
            srcset="images/largeme.jpg">
    <source media="(min-width: 465px)"
            srcset="images/medme.jpg">
    <img src="images/smallme.jpg"alt="hero profile">
</picture>

and it defaults to the medme.jpg picture no matter the width of the window. I set down this:

<picture>
    <source media="(min-width: 1000px)"
            srcset="images/largeme.jpg">
    <source media="(min-width: 465px)"
            srcset="images/medme.jpg">
   <!-- <img src="images/smallme.jpg"alt="hero profile">-->
</picture>

commenting out the img fallback tag and it doesn't show anything.

I'm running Chrome 52 which should support picture element. But it seems to be acting as if it doesn't support it or something. What am I doing wrong here?

Answer 1

It sounds silly, but have you tried reverting the order? For some reason doing this made it work for me.

So, instead of:

<picture>
    <source media="(min-width: 1000px)"
            srcset="images/largeme.jpg">
    <source media="(min-width: 465px)"
            srcset="images/medme.jpg">
    <img src="images/smallme.jpg"alt="hero profile">
</picture>

try this:

<picture>
    <source media="(min-width: 465px)"
            srcset="images/medme.jpg">
    <source media="(min-width: 1000px)"
            srcset="images/largeme.jpg">
    <img src="images/smallme.jpg"alt="hero profile">
</picture>