responsive system don't work Bootstrap 4 version

i want to create a responsive navigation bar with bootstrap 4 but unfortunately i got some error when i set up the screen under the 1024 * 1366 resolution the responsive system don't work well.

over 1024*1366 resolution :

under 1024*1366 resolution :

my code :

  <header>
    <nav class="navbar navbar-expand bg-success navbar-dark">
      <a class="navbar-brand" href="#">
        <img src="img/images.png" alt="Logo" style="width:50px;">
      </a>
      <ul class="navbar-nav">
        <li class="nav-item dropdown">
          <a class="nav-link dropdown-toggle text-light" href="#" id="navbardrop" data-toggle="dropdown">
            Menu
          </a>
          <div class="dropdown-menu">
            <a class="dropdown-item" href="#">Trap</a>
            <a class="dropdown-item" href="#">RnB</a>
            <a class="dropdown-item" href="#">Old-School</a>
          </div>
        </li>
        <li class="nav-item">
          <a class="nav-link text-light" href="#">Home</a>
        </li>
        <li class="nav-item">
          <a class="nav-link text-light" href="#">About me</a>
        </li>
        <li class="nav-item">
          <a class="nav-link text-light" href="#">Contact</a>
        </li>
        <form class="form-inline" action="/action_page.php">
    <input class="form-control mr-sm-2" type="text" placeholder="Search">
    <button class="btn btn-light" type="submit">Search</button>
  </form>
        </ul>
        <ul class="navbar-nav ml-auto">
        <li class="nav-item">
            <img src="img/finger.png" class="nav-link" style="width:40px">
          </li>
          <li class="nav-item">
            <a href="" class="nav-link text-light">sign up</a>
          </li>
          <li class="nav-item">
            <img src="img/profil.png" class="nav-link" style="width:40px">
          </li>
          <li class="nav-item">
            <a href="" class="nav-link text-light">login</a>
          </li>
          <li class="nav-item ">
            <img src="img/basket.png" class="nav-link" style="width:40px;">
          </li>
          <li class="nav-item">
            <a class="nav-link text-light" href="#">Panier</a>
          </li>
        </ul>
    </nav>
  </header>

thanks