0

What I mean by that is that say I have the following html:

<div class="section-cover__image-container">
  <img class="section-cover__image" src="{{ image }}" />
</div>

How would I style the container and image so that the image acts asif it is being used as a background image on the div using background-size: cover, with no-repeat and center?

  • Is scaling required? Just setting the wrapper to `inline-block` would work. Otherwise, perhaps `object-fit`? – Paulie_D Jul 07 '16 at 11:07
  • Exactly same behaviour is not possible without javascript. If width > height you will set a `max-width` property on the image and the other way around. https://jsfiddle.net/4jajjrk8/1/. – oshell Jul 07 '16 at 11:32

0 Answers0