using <picture> tag with Internet Explorer 11

html css explorer polyfills
Lucky500 picture Lucky500 · Aug 21, 2018 · Viewed 15k times · Source

Have been searching the internet for a while and no solution.

I am trying to use slick carousel with the new picture tag, works great in every browser but IE 11. does anyone know about a workaround/polyfill for IE 11?

Answer

zucc0nit picture zucc0nit · Aug 22, 2018

The <picture> tag is part of HTML5 but on the documentation, the fallback is <img> which will even work on old browsers. 

<picture>
   <source media="(min-width: 64em)" src="high-res.jpg">
   <source media="(min-width: 37.5em)" src="med-res.jpg">
   <source src="low-res.jpg">
   <img src="fallback.jpg" alt="This picture loads on non-supporting browsers.">
   <p>Accessible text.</p>
</picture>

Related questions

How to horizontally center a <div>

How can I horizontally center a <div> within another <div> using CSS? <div id="outer"> <div id="inner">Foo foo</div> </div>

Read More
How do I vertically center text with CSS?

I have a <div> element which contains text and I want to align the contents of this <div> vertically center. Here is my <div> style: #box { height: 170px; width: 270px; background: #000; font-size: 48px; color: #…

Read More
How to align a <div> to the middle (horizontally/width) of the page

I have a div tag with width set to 800 pixels. When the browser width is greater than 800 pixels, it shouldn't stretch the div, but it should bring it to the middle of the page.

Read More