Bootstrap раскрывающееся меню не может плавать влево

Question

У меня есть эта навигация с раскрывающимся списком

  <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
        <a class="navbar-brand" href="#">SearchICE</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarCollapse">
         <div class="input-group len">
          <input type="text" class="form-control sblength" placeholder="Recipient's username" aria-label="Recipient's username" aria-describedby="basic-addon2">
          <div class="input-group-append">
            <button class="btn btn-success bround" type="button">Search</button>
          </div>
        </div>
          <div class="btn-group ml-auto">
          <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Account
          </button>
          <div class="dropdown-menu dropdown-menu-left">
            <button class="dropdown-item" type="button">Action</button>
            <button class="dropdown-item" type="button">Another action</button>
            <button class="dropdown-item" type="button">Something else here</button>
          </div>
        </div>
          </div
      </nav>

, а это раскрывающийся список

<div class="btn-group ml-auto">
      <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Account
      </button>
      <div class="dropdown-menu dropdown-menu-left">
        <button class="dropdown-item" type="button">Action</button>
        <button class="dropdown-item" type="button">Another action</button>
        <button class="dropdown-item" type="button">Something else here</button>
      </div>
    </div>

Это скрипка https://jsfiddle.net/yztumo0x/1/ и https://jsfiddle.net/yztumo0x/1/show

Раскрывающееся меню account не смещается влево, а вместо этого выступает вправо, где его не видно.

Как я могу это исправить?

Answer 1

У меня вроде нормально работает. Проверьте Codepen . Убедитесь, что вы импортировали правильные файлы js и css.

<div class="btn-group ml-auto">
      <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Account
      </button>
      <div class="dropdown-menu dropdown-menu-right">
        <button class="dropdown-item" type="button">Action</button>
        <button class="dropdown-item" type="button">Another action</button>
        <button class="dropdown-item" type="button">Something else here</button>
      </div>
    </div>