удалить вертикальное пространство между div

Question

Я пытаюсь добавить два изображения в один ряд, и он должен go постоянно в вертикальном направлении, но проблема, с которой я сталкиваюсь, заключается в том, что я получаю пространство между изображениями по вертикали.

Я пытался добавить CSS но это не сработало. (примечание: я перебираю изображения, поэтому я не могу применить CSS для разных изображений, это должно быть применимо ко всем изображениям одновременно)

.menu-spacer {
  flex: 1 1 auto;
}

a {
  padding-right: 5em;
}

.menu-spacer1 {
  flex: 1 1 auto;
  padding-top: 15em;
}

#second-row {
  margin-top: 2em;
}

#first-row {
  border-top-left-radius: 3em;
  box-shadow: 0 16px 24px 2px rgb(245, 245, 248), 0 6px 15px 1px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.3);
}

#search-button {
  margin-left: 7em;
  border-radius: 2em;
  width: 24em;
  height: 30px;
  outline-style: none;
  text-align: center;
  border-width: 2px;
  border-color: black;
}

#mn {
  height: 12em;
}

h1 {
  color: white;
  margin-left: 2em;
  margin-top: 3em;
  font-size: 28px;
}

#img {
  margin-top: 9em;
  padding: 0;
  width: 12em;
  margin-left: 2em;
}

#img1 {
  height: 13em;
  padding: 0em;
}

#img2 {
  float: right;
  /* float: top; */
  height: 13em;
  position: relative;
  top: -15em;
}

.example-card {
  padding: 0em;
}

p {
  margin-top: 10em;
  margin-left: -214px;
  color: #e67500;
  font-size: 15px;
  font-family: ProximaNova, Arial, Helvetica Neue, sans-serif;
}

h2 {
  margin-top: 12em;
  margin-left: -567px;
  color: #e67500;
  font-size: 15px;
  font-family: ProximaNova, Arial, Helvetica Neue, sans-serif;
}

#rating {
  font-size: 15px;
  margin-top: 16em;
  margin-left: -95px;
  color: white;
}

mat-icon {
  font-size: 15px;
  position: relative;
  top: 2px;
  left: 5px;
}

#ratingcount {
  font-size: 12px;
  color: #e67500;
  margin-top: 24em;
  margin-left: -39px;
}

#time {
  font-size: 16px;
  margin-top: 15em;
  margin-left: -32em;
  color: white;
}

#timealias {
  font-size: 12px;
  margin-top: 24em;
  margin-left: -5em;
  color: #e67500;
}

#cost {
  font-size: 16px;
  color: white;
  margin-top: 15em;
  position: relative;
  right: 32em;
}

#costalias {
  position: relative;
  font-size: 12px;
  top: 12em;
  left: -45em;
  color: #e67500;
}

.mat-divider {
  color: white;
  background-color: yellow;
  height: 43px;
  position: relative;
  left: -554px;
  top: 132px;
}


/* #right-content{
        margin-left: 74em;
        margin-top: -13em;
      } */

#menu-img {
  margin-right: 4em;
  /* margin-top: 6em; */
  height: 13em;
  margin-top: 0em;
  /* vertical-align: bottom; */
}

#menu-name {
  margin-left: 1.5em;
  margin-top: 1em;
  color: #282c3f;
  font-size: 15px;
  font-weight: 500;
  font-family: Roboto, "Helvetica Neue", sans-serif;
}

#veg-img {
  position: relative;
  top: 115px;
  right: 332px;
  width: 15px;
}

#menu-type {
  position: relative;
  top: -10em;
  left: 236px;
  font-family: ProximaNova, Arial, Helvetica Neue, sans-serif;
  color: #7e808c;
  font-size: 13px;
}

#menu-price {
  position: relative;
  top: -275px;
  right: -236px;
  color: #535665;
  font-size: 15px;
}

.menu-button {
  color: green;
  background-color: white;
  border-color: yellowgreen;
  position: relative;
  top: -319px;
  left: 194px;
  width: 5em;
  height: 2em;
  border-style: solid;
}

<app-swiggy-header></app-swiggy-header>
<div class="row-6" id="second-row">
  <mat-toolbar [ngStyle]="{'backgroundColor': '#171a29'}" id="mn">
    <mat-toolbar-row>
      <img src="assets/swiggyimages/moriz.jpg" id="img">

      <h1>Moriz Restaurant</h1>
      <p>Fast Food, Snacks, Pastas, Salads, Beverages, Home Food, Italian, North Indian, Ma</p>
      <h2>ACES Layout</h2>
      <span id="rating">
        <mat-icon>star</mat-icon>4.5
      </span>
      <span id="ratingcount">100+ Ratings</span>
      <hr>
      <mat-divider vertical></mat-divider>
      <span id="time">30 mins</span>
      <span id="timealias">Delivery Time</span>
      <hr>
      <mat-divider vertical></mat-divider>
      <span id="cost">150</span>
      <span id="costalias">Cost for two</span>
    </mat-toolbar-row>
  </mat-toolbar>
</div>

<div class="row">
  <div class="col-3" id="left-content">abc</div>
  <div class="col-xs-12 col-md-8">
    <div class="row">
      <div class="col-xs-4 ">
        <img src="assets/swiggyimages/moriz.jpg" class="img-responsive" alt="Logo" id="menu-img">
        <img src="assets/swiggyimages/veg.png" id="veg-img">
        <p id="menu-name">Paneer-Veg-Biryani</p>
        <p id="menu-type">Rice</p>
        <p id="menu-price">105</p>
        <button class="menu-button">ADD</button>
      </div>
      <div class="col-xs-4 ">
        <img src="assets/swiggyimages/moriz.jpg" class="img-responsive" alt="Logo" id="menu-img">
        <img src="assets/swiggyimages/veg.png" id="veg-img">
        <p id="menu-name">Paneer-Biryani</p>
        <p id="menu-type">veg</p>
        <p id="menu-price">105</p>
        <button class="menu-button">ADD</button>
      </div>

      <div class="col-xs-4 ">
        <img src="assets/swiggyimages/moriz.jpg" class="img-responsive" alt="Logo" id="menu-img">
        <img src="assets/swiggyimages/veg.png" id="veg-img">
        <p id="menu-name">Paneer-Biryani</p>
        <p id="menu-type">veg</p>
        <p id="menu-price">105</p>
        <button class="menu-button">ADD</button>
      </div>
      <div class="col-xs-4 ">
        <img src="assets/swiggyimages/moriz.jpg" class="img-responsive" alt="Logo" id="menu-img">
        <img src="assets/swiggyimages/veg.png" id="veg-img">
        <p id="menu-name">Paneer-Biryani</p <p id="menu-type">veg</p>
        <p id="menu-price">105</p>
        <button class="menu-button">ADD</button>
      </div>
    </div>
  </div>
  <div class="col-3" id="right-content">mnc</div>
</div>