Bootstrap 2 columns but not another row

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>

They are in two columns but there is space at the right left, I want to push the Hawaii state at the right as well so that space is fill at the right, I am making it for wordpress with php. I can change the structure for it but I want to do it with bootstrap,

here is the screenshot of the preview

https://stackoverflow.com/questions/65919507/bootstrap-2-columns-but-not-another-row January 27, 2021 at 08:47PM