In their design, there is a wrapper containing all the rows with a fixed responsive width. They use media queries to define a fixed width for each screen size and apply display:flex and flex-direction:column to stack the rows on top of each other. Each row contains three divs with flex:1 0 0% to evenly split the width. Inside each div, there is an image with defined sizes in the srcset attribute, ensuring equal heights.
The fixed width of the wrapper is divided among the children, and the height is determined by the images.
Example:
I have divided your example into two rows, each with three images. Instead of using the srcset attribute for responsive images, I have assigned a fixed height to each image for the sake of this explanation.
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.container {
display: flex;
flex-direction: column;
max-width: 935px !important;
/* Because in here bootsrtap comes after the editor css*/
}
.container>.row {
display: flex;
flex-direction: row;
}
.container>.row>div {
flex: 1 0 0%;
}
.container>.row>div img {
max-width: 100%;
height: 293px;
}
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css">
<div class="container">
<h1 class="my-4 text-center text-lg-left"></h1>
<div id="" class="row text-center text-lg-left">
<div class="col-lg-4 col-sm-6">
<a href="" class="d-block mb-4 h-100" target="_blank">
<img class="img-fluid img-thumbnail" src="https://www.instagram.com/p/BjiCy5uDPHp/media/?size=l" alt="">
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="" class="d-block mb-4 h-100" target="_blank">
<img class="img-fluid img-thumbnail" src="https://www.instagram.com/p/Bjhw_0DDAKB/media/?size=l" alt="">
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="" class="d-block mb-4 h-100" target="_blank">
<img class="img-fluid img-thumbnail" src="https://www.instagram.com/p/BjhXUb5DVo4/media/?size=l" alt="">
</a>
</div>
</div>
<div id="" class="row text-center text-lg-left">
<div class="col-lg-4 col-sm-6">
<a href="" class="d-block mb-4 h-100" target="_blank">
<img class="img-fluid img-thumbnail" src="https://www.instagram.com/p/BjhF2fDjc6E/media/?size=l" alt="">
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="" class="d-block mb-4 h-100" target="_blank">
<img class="img-fluid img-thumbnail" src="https://www.instagram.com/p/Bjgz6KJDw2S/media/?size=l" alt="">
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="" class="d-block mb-4 h-100" target="_blank">
<img class="img-fluid img-thumbnail" src="https://www.instagram.com/p/Bjggi3mjTxf/media/?size=l" alt="">
</a>
</div>
</div>
</div>