JSFiddle - React, Tailwind, and code Playground

HTML

<div class="img_wrapper">
    <img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" class="img" />
</div>

CSS

.img_wrapper
{
    position: relative;
    height: 400px;
}
 
.img
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
 
    width: 100%;
    height: auto;
    margin: auto;
}

JavaScript

$(window).resize(function(){
    if ($(window).height() < $('.img_wrapper').height()) {
        $('.img_wrapper').css('height',$(window).height());
    } else {
         $('.img_wrapper').css('height','400px');   
    }
    
});