0

I'm currently using picture srcset for responsive images and currently looking for a way to make it scale or cover the entire element or container, much like css background-size: cover or object-fit. I've read that object-fit only works on img tags is there an alternative for srcset. I'm using Drupal 8 responsive image module and it renders a picture element

<picture>
    <source srcset="/aim-beta/sites/default/files/styles/thumbnail/public/2017-08/admissions-banner-how-to-apply-alt.jpg?itok=O11apfmI 1x" media="all and (max-width: 480px)" type="image/jpeg">
    <source srcset="/aim-beta/sites/default/files/styles/medium/public/2017-08/admissions-banner-how-to-apply-alt.jpg?itok=QrLnqmKd 1x" media="all and (max-width: 768px)" type="image/jpeg">
    <img srcset="/aim-beta/sites/default/files/2017-08/admissions-banner-how-to-apply-alt.jpg" alt="Admissions - How to Apply" typeof="foaf:Image">
</picture>
clestcruz
  • 1,081
  • 3
  • 31
  • 75

1 Answers1

0

object-fit works on responsive images, because you style the <img>, not the <picture>.

Nicolas Hoizey
  • 1,954
  • 1
  • 17
  • 24