How to fit a image in div wather image size is max then div or min then div

use this in the element child "height: inherit;" and this elements will be the same height of partner.

.main{
       height:200px;
       width:200px;
}

.img{
  height: inherit; //the imagem will be heigth 200px automatic
}

You can use:

img { max-width: 100%; height: auto; } // This would help you to automatically fit the image.

The above css code would help you for the images whose size is larger than the div. But won't fit for images which are smaller than the div. A bit of jQuery would be needed to achive your goal, please find it below:

$(document).ready(function(){
    imageWidth = $('.main img').width();
    parentWidth = $('.main').width();
    if (imageWidth > parentWidth) {
        $('.main img').css('width', '100%');
    }
});

What happens is when the image is smaller than the div it resizes itself and fits to the div as per your requirement.

Hence place the css as well as the script to work for both the conditions.