title: Bootstrap 4 Grid issue in small devices
body: <p>My code is given below</p>
  
  <pre><code>&lt;div class="row align-items-center"&gt;
    &lt;div class="col-12 col-xl-6 col-lg-6 col-md-12 col-sm-12"&gt;
      One of three columns
    &lt;/div&gt;
    &lt;div class="col-12 col-xl-6 col-lg-6 col-md-12 col-sm-12"&gt;
     One of three columns
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS look like below</p>
  
  <pre><code>.row {
      height: calc(70vh - 60px);
  }
  </code></pre>
  
  <p>When I check-in mobile or small device grid item put some space in upper side and lower side. screenshot attached below 
  <a href="https://i.stack.imgur.com/piSEw.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/piSEw.png" alt="enter image description here"></a></p>
  
  <p>you can see space. I want to make div without space.
  How can I?</p>