A LESS mixin to create fluid images with no re-flow, based on intrinsic ratios and absolute positioning. Reference: http://mobile.smashingmagazine.com/2013/09/16/responsive-images-performance-problem-case-study http://alistapart.com/article/creating-intrinsic-ratios-for-video

intrinsic-ratio

.responsive-img(@width, @height) {
    @ratio: (@height / @width) * 100;

    position: relative;
    padding-bottom: ~"@{ratio}%";
    height: 0;

    img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

.img-container {
    .responsive-img(400,300);
}

markup.html

<div class="img-container">
  <img src="http://placehold.it/400x300">  
</div>