title: Full height side by side images in bootstrap
body: <p>I want to obtain the structure exemplified in the image bellow. There will be a full width &amp; height container with 2 images and other elements inside. My images should be full-height(the height of container) and auto-width inside the container(growing from center to left, respectively to the right). My problem is that my images are much higher than container and I need to limit them somehow to be inside the container(red area) also to fill the full height of it. <a href="https://i.stack.imgur.com/E8zzh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/E8zzh.png" alt="desired structure"></a>
  PS.1 All images are in portrait mode and all of them have same height.
  PS.2 I had a look at the other questions on Stack.
  PS.3 You got <a href="https://www.bootply.com/quRW1u3Luk" rel="nofollow noreferrer" title="Bootply">here</a> my non working example.</p>
  
  <p>Any suggestions are welcome. Thank you!</p>