JSFiddle - React, Tailwind, and code Playground

by wdm954

HTML

<img class="img" src="http://theiau.com/blog/wp-content/uploads/2010/10/sky.jpg" />

CSS

html, body {
    padding: 0px;
    text-align: center;
}

/*
.img {
    width: 250px;
    height: 250px;
}
*/

JavaScript

$(function() {
    
    h = $('.img').height();
    w = $(window).height();
    
    if (h < w) { 
        $('.img').css('margin-top', (w - h) /2 + "px");
    }
    else {
        $('.img').height(w);
    }

});