Make bootstrap 5 dropdowns same width as navbar - html

Question

I have a bootstrap dropdown that I want to make the same width as the navbar. Instead of it going 100% the width of the navbar, it's going 100% the width of the screen. I've tried everything I can think of and I can't get it to be the width of the navbar. Any help would be greatly appreciated. Thanks!
<ul class="nav nav-tabs" id="billet-management-tabs" role="tablist">
<li class="nav-item" id="dashboard-nav-item" role="presentation">
<button id="dashboard-tab" data-bs-toggle="tab" data-bs-target="#dashboard-content" class="nav-link" type="button" role="tab">Dashboard</button>
</li>
<li class="dropdown-start">
<div class="dropdown ">
<div class="nav-item" id="positions-nav-item" role="presentation" data-bs-toggle="dropdown">
<button id="positions-tab" data-bs-toggle="tab" class="nav-link dropdown-toggle" aria-haspopup="true" type ="button">Positions</button>
</div>
<ul class="dropdown-menu" aria-expanded="false">
<li class="dropdown-item" id="billets-nav-item" role="presentation" data-bs-toggle="tab">
<button id="billets-tab" data-bs-toggle="tab" data-bs-target="#billets-content" class="nav-link" aria-haspopup="true" type="button" role="tab">Billets</button>
</li>
<li class="dropdown-item" id="position-descriptions-nav-item" role="presentation">
<button id="position-descriptions-tab" data-bs-toggle="tab" data-bs-target="#position-descriptions-content" class="nav-link text-left" type="button" role="tab">Position Descriptions</button>
</li>
<li class="dropdown-item" id="staffing-actions-nav-item" role="presentation">
<button id="staffing-actions-tab" data-bs-toggle="tab" data-bs-target="#staffing-actions-content" class="nav-link" type="button" role=tab>Staffing Actions</button>
</li>
<li class="dropdown-item" id="labor-categories-nav-item" role="presentation">
<button id="labor-categories-tab" data-bs-toggle="tab" data-bs-target="#labor-categories-content" class="nav-link" type="button" role="tab">Labor Categories</button>
</li>
<li class="dropdown-item" id="staffing-action-nav-item" role="presentation">
<button id="staffing-action-tab" data-bs-toggle="tab" data-bs-target="#staffing-action-content" class="nav-link" type="button" role="tab">Staffing Action</button>
</li>
<li class="dropdown-item" id="staffing-matrix-nav-item" role="presentation">
<button id="staffing-matrix-tab" data-bs-toggle="tab" data-bs-target="#staffing-matrix-content" class="nav-link" type="button" role="tab">Staffing Matrix</button>
</li>
</ul>
</div>
</li>
</ul>
.dropdown-item {
color:#F8F8F8;
}
.dropdown-item:active {
background-color: #006bb5;
}
.dropdown-item:hover {
background-color: #0054b5;
color: #F8F8F8;
}
.nav-link {
width: 100%;
color: #F8F8F8;
border: none;
font-weight:600;
font-size:1.2rem;
padding-left:25px;
padding-right:25px;
}
.nav-link:focus {
color: #F8F8F8;
}
.nav-link:hover {
border: none;
color:#F8F8F8;
margin-bottom: -1px;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
background-color: #006bb5;
color: #F8F8F8;
}
.nav-tabs .nav-link{
border-radius:0;
border:0;
}
.dropdown-menu {
padding: 0px;
margin: 0px;
background-color: #006bb5;
border-radius: 0;
box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.75);
}
.dropdown-nav {
list-style: none;
padding: 0px;
margin:0px;
}
.nav {
background-color: #131523;
}
.nav > li > .dropdown {
position: static;
}
.nav li .dropdown > .dropdown-menu.show{
width:100%;
display:flex;
}