Code snippets and reusable bits

NOTE: if you're in https you will need to refresh each snippet post to see the actual code! 

Object-fit: cover fallback solution for IE

Object-fit is used to define how the content (like an image) reacts to the dimensions of its content box. If we wanted an image to behave similarly to how background images do when using background-size: cover, we can use object-fit: cover (see CSSTricks article for full coverage of this property here: https://css-tricks.com/almanac/properties/o/object-fit/)

However, this property is not supported by IE, and that's the reason why we need a fallback solution. Here's the one I've been using.

object-fit.png