Image hover effect

Demo : https://codepen.io/BretCameron/pen/NJWdoM?__cf_chl_jschl_tk__=f8c814c8e83fa657c10108251d89d0b26296475d-1589794249-0-AX3sn3o99zMfQCRGIc6G94hhX-reGek4-Jsh6eWmV75EfA7HSkHihs_keXSH7FOyYEdqXL1-qAUUruOkDyvq6Iu_mdC2vUkwLlOcQEkYCtvC--ycFcC51aBfhx9Akk1vvJIDnuB5WdOHYD9mszv41ztWN5KQCzuO1K2X2tRN6GHBZGgajXfl2UXkP7JrwQ8fqy35rpD68K--7ddesu4x20215Lf0Q2G-6TzFH-WzKdpOFNrzV0dI7NlA3X7vd94Cp1Qj7zNwBCaldfy-9yoxK902jl1DDR_4CWNw9x_fw44ofn9Y7wpvdv_oFWs6CfFRC5bwxeRNyB8WCF3ig7sHvhMpITSgwTn0oG_q4yuK2mGK


<style type="text/css">
.img-wrapper { 
  width: 400px;
  height: 400px;
  overflow: hidden;
}

.inner-img {
  transition: 0.3s;
}

.inner-img:hover {
  transform: scale(1.1);
}

/* Other styling elements, that are not necessary for the example */

.img-wrapper {
  display: inline-block;
  box-sizing: border-box;
  //border: 1px solid #000;
}
</style>



<div class="img-wrapper">
    <img class="inner-img" src="https://source.unsplash.com/random/400x400" />
</div>