Maintain flexgrid on hover

maintain-grid-with-hover-effect.html

<div class="wrap">
  <div class="item"><img src="https://via.placeholder.com/150" /></div>
  <div class="item"><img src="https://via.placeholder.com/150" /><</div>
  <div class="item"><img src="https://via.placeholder.com/150" /><</div>
</div>

style.css

.wrap {
  display: flex;
  max-width: 1140px;
}

.home-middle .widget_media_image {
  max-width: 400px;
	width: 300px;
  overflow: hidden;
	transition: all .5s ease-in-out;
}
.home-middle .widget_media_image:hover {
  width: 400px;
	max-width: 400px;
	margin-left: -25px;
}