html - Bootstrap 2 columns but not another row

Question

Here is my Markup for the bootstrap

<script
  src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script
  src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
  integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
  crossorigin="anonymous"></script>
<link
  href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
  rel="stylesheet"/>
<pre>
  <div class="row">
  <div
    class="col-lg-6 boxListCont">
  
    <h3 class="fs-32 mb-30">California</h3>
    
    <a
      href="http://www.realitysb.com/carpinteria/"
      class="full lh-80 mb-25 boxList color-white1"
      data-aos="fade-up"
      data-aos-offset="10"
      data-aos-delay="1"
      data-aos-duration="700">
    <span class="boxDCont">
      <span
        class="boxD fs-32 color-black1 uppercase bg-yellow">CPN</span>
      </span>
      <span class="pl txtD pl-25">
      <em class="ellipsis">Carpinteria</em>
      <i class="svg-ico"
         data-svg="angleArr"></i>
    </span>
    </a>
    
    <a href="http://realitysf.com/"
       class="full lh-80 mb-25 boxList color-white1"
       data-aos="fade-up"
       data-aos-offset="10"
       data-aos-delay="1"
       data-aos-duration="700">
    <span class="boxDCont">
    <span
      class="boxD fs-32 color-black1 uppercase bg-yellow">SF</span>
    </span>
    <span class="pl txtD pl-25">
    <em class="ellipsis">San Francisco</em>
    <i class="svg-ico"
       data-svg="angleArr"></i>
    </span>
    </a>
    
    <a href="http://www.realitysb.com/"
       class="full lh-80 mb-25 boxList color-white1"
       data-aos="fade-up"
       data-aos-offset="10"
       data-aos-delay="1"
       data-aos-duration="700">
    <span class="boxDCont">
    <span
      class="boxD fs-32 color-black1 uppercase bg-yellow">SB</span>
    </span>
    <span class="pl txtD pl-25">
    <em class="ellipsis">Santa Barbara</em>
    <i class="svg-ico"
       data-svg="angleArr"></i>
    </span>
    </a>
    
    <a
      href="http://www.realitystockton.com/"
      class="full lh-80 mb-25 boxList color-white1"
      data-aos="fade-up"
      data-aos-offset="10"
      data-aos-delay="1"
      data-aos-duration="700">
    <span class="boxDCont">
    <span
      class="boxD fs-32 color-black1 uppercase bg-yellow">STK</span>
    </span>
    <span class="pl txtD pl-25">
    <em class="ellipsis">Stockton</em>
    <i class="svg-ico"
       data-svg="angleArr"></i>
    </span>
    </a>
    
    <a
      href="http://www.realitysb.com/ventura/"
      class="full lh-80 mb-25 boxList color-white1"
      data-aos="fade-up"
      data-aos-offset="10"
      data-aos-delay="1"
      data-aos-duration="700">
    <span class="boxDCont">
    <span
      class="boxD fs-32 color-black1 uppercase bg-yellow">VEN</span>
    </span>
    <span class="pl txtD pl-25">
    <em class="ellipsis">Ventura</em>
    <i class="svg-ico"
       data-svg="angleArr"></i>
    </span>
    </a>
    </div>
    <div
      class="col-lg-6 boxListCont">
    
    <h3
      class="fs-32 mb-30">Massachusetts</h3>
    
    <a
      href="http://www.realityboston.com/"
      class="full lh-80 mb-25 boxList color-white1"
      data-aos="fade-up"
      data-aos-offset="10"
      data-aos-delay="1"
      data-aos-duration="700">
    <span class="boxDCont">
    <span
      class="boxD fs-32 color-black1 uppercase bg-yellow">BST</span>
    </span>
    <span class="pl txtD pl-25">
    <em class="ellipsis">Boston</em>
    <i class="svg-ico"
       data-svg="angleArr"></i>
    </span>
    </a>
    </div>
    <div
      class="col-lg-6 boxListCont">
    
    <h3 class="fs-32 mb-30">Hawaii</h3>
    
    <a
      href="http://realityhonolulu.com/"
      class="full lh-80 mb-25 boxList color-white1"
      data-aos="fade-up"
      data-aos-offset="10"
      data-aos-delay="1"
      data-aos-duration="700">
    <span class="boxDCont">
    <span
      class="boxD fs-32 color-black1 uppercase bg-yellow">HNL</span>
    </span>
    <span class="pl txtD pl-25">
    <em class="ellipsis">Honolulu</em>
    <i class="svg-ico"
       data-svg="angleArr"></i>
    </span>
    </a>
    </div>
    
    
  </div>
</pre>

question from:https://stackoverflow.com/questions/65919507/bootstrap-2-columns-but-not-another-row

Answer 1

<div class="col-lg-6 boxListCont text-center">

Try adding 'text-center' to the columns you want to push more to the right