So responsive images are BRILLIANT with Bootstraps handy html class
.img-fluid
I also use EWWW for optimizing my images on Wordpress and converting images to WEBP.
However I wanted my background images to use have the same proportions whilst working responsively.
I used the below mixin and it has changed my life. Give it try.
@mixin responsive-bg-image($image-width, $image-height) {
background-size: cover;
height: 0;
padding-bottom: percentage($image-height / $image-width);
display: block;
position: relative;
}
Top comments (0)