qqNemo

Не решение, но хороший пример. Поменьше статики в размерах

.nav-item a { font-size:100%; }
@media (min-width: 576px) { .nav-item a {font-size:0.7rem!important;} .nav-item {margin-right: 1vw!important;} .nav-link {padding: 0.5rem 0.3rem !important;}}
@media (min-width: 650px) { .nav-item a {font-size:0.7rem!important;} .nav-item {margin-right: 1.25vw!important;}.nav-link {padding: 0.5rem 0.5rem !important;}}
@media (min-width: 768px) { .nav-item a {font-size:0.8rem!important;} .nav-item {margin-right: 1.5vw!important;} .nav-link {padding: 0.5rem 0.5rem !important;}}
@media (min-width: 992px) { .nav-item a {font-size:0.9rem!important;} .nav-item {margin-right: 1.75vw!important;}}
@media (min-width: 1200px) { .nav-item a {font-size:1rem!important;} .nav-item {margin-right: 2.25vw!important;}}

.nav {
    margin: 0 auto;
}


.nv-block a, .nv-block span {
    text-decoration: none;
    color: white;
}

.nv-block a:hover, .nv-block span:hover {
    background-color: rgba(0, 0, 0, 0.116) ;
    border-radius: 30px;
}

.nv-block .actives {
    background-color: rgba(0, 0, 0, 0.116) ;
    border-radius: 30px;
}

<nav class="navbar navbar-expand flex-column flex-sm-row" style="background-color: #4d77a9;">                                          
  <div class="collapse justify-content-center navbar-collapse" id="navbarNav">                                                         
    <a class="navbar-brand" style="margin-right: 50px;" href="#">                                                                      
      <img src="./images/vkbonus.png" height="60" class="d-inline-block align-text-top">                                               
    </a>                                                                                                                               
    <ul class="nav nav-pills flex-column flex-sm-row">                                                                                 
      <li class="nav-item nv-block">                                                                                                   
        <a class="nav-link flex-sm-fill text-sm-center small-font actives" aria-current="page" href="#">заработать баллы</a>           
      </li>                                                                                                                            
      <li class="nav-item nv-block">                                                                                                   
        <a class="nav-link flex-sm-fill text-sm-center small-font" aria-current="page" href="#">мои задания</a>                        
      </li>                                                                                                                            
      <li class="nav-item nv-block">                                                                                                   
        <a class="nav-link flex-sm-fill text-sm-center small-font disable"  aria-current="page" href="#">онлайн-бот</a>                
      </li>                                                                                                                            
      <li class="nav-item nv-block">                                                                                                   
        <a class="nav-link flex-sm-fill text-sm-center small-font" aria-current="page" href="#">аукцион</a>                            
      </li>                                                                                                                            
      <li class="nav-item nv-block">                                                                                                   
        <a class="nav-link flex-sm-fill text-sm-center small-font" aria-current="page" href="#">топ-100</a>                            
      </li>                                                                                                                            
    </ul>                                                                                                                              
    <div class="nv-block">                                                                                                             
      <a href="#" class="nv-block small-font">                                                                                         
        RU</a>                                                                                                                         
      <a href="#" class="nv-block small-font">                                                                                         
        EN                                                                                                                             
      </a>                                                                                                                             
    </div>                                                                                                                             
    <a class="navbar-brand" style="margin-right: 50px;" href="#">                                                                      
      <img src="./images/menu3.png" height="50px" class="d-inline-block ml-4 align-text-top">                                          
    </a>                                                                                                                               
  </div>                                                                                                                               
</nav>

А белая полоска скрола появляется из-за размера ширины у родителя