I am trying to use 2 columns in a drop down menu, I am having trouble with the 2 columns being too close together and the with text from the 2nd column going beyond the drop down background.

<nav class="navbar navbar-expand-lg navbar-dark unique-color">  <nav class="navbar navbar-expand-lg navbar-dark unique-color">    <div class="container">           <!-- Navbar brand -->                         <!-- Collapse button -->      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"        aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>            <!-- Collapsible content -->      <div class="collapse navbar-collapse" id="navbarSupportedContent">                 <!-- Links -->                <ul class="navbar-nav mr-auto">                    <!-- Dropdown -->                    <li class="nav-item dropdown btn-group">           <a class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Elected Officials / Departments</a>            <div class="dropdown-menu dropdown-primary" aria-labelledby="navbarDropdownMenuLink">                               <div class="row">                  <div class="col-md-2 offset-md-1">            <a class="dropdown-item" href="/assessor/index.php">Assessor</a>             <a class="dropdown-item" href="/clerk/index.php">Clerk of the Court</a>             <a class="dropdown-item" href="/commissioners/index.php">Commissioners</a>             <a class="dropdown-item" href="/coroner/index.php">Coroner</a>            <a class="dropdown-item" href="/district_court/index.php">District Court</a>              <a class="dropdown-item" href="/prosecutor/index.php">Prosecutor</a>             <a class="dropdown-item" href="/superior_court/index.php">Superior Court</a>             <a class="dropdown-item" href="/treasurer/index.php">Treasurer</a>  </div>     <div class="col-md-2">            <a class="dropdown-item" href="/equalization/index.php">Board Of Equalization</a>             <a class="dropdown-item" href="/civil_service/index.php">Civil Service</a>             <a class="dropdown-item" href="/community-services/index.php">Community Services            <br>            (Building, Fire Marshal, Planning, Public Health)</a>            <a class="dropdown-item" href="/dem/index.php">Emergency Management</a>            <a class="dropdown-item" href="/facilities/index.php">Facilities and Grounds</a>             <a class="dropdown-item" href="/gis/index.php">GIS / Mapping</a>  <a class="dropdown-item" href="/hearings_examiner/index.php">Hearing Examiner</a>             <a class="dropdown-item" href="/human_resources/index.php">Human Resources</a>            <a class="dropdown-item" href="/information-services/index.php">Information Services</a>            <a class="dropdown-item" href="/leoff/index.php">LEOFF Board</a>            <a class="dropdown-item" href="/parks/index.php">Parks and Trails</a>            <a class="dropdown-item" href="/probation/index.php">Probation</a>            <a class="dropdown-item" href="/public_defender/index.php">Public Defense</a>            <a class="dropdown-item" href="/public_works/index.php">Public Works / Roads</a>             <a class="dropdown-item" href="/utilities_waste/index.php">Utilities / Waste Management</a>        </div>             </div>
</div>          </li>                           </ul>        <!-- Links -->
</div>      <!-- Collapsible content -->     </div>  </nav>