bootstrap dropdown bubble align right (bukan push-right)

Saya memiliki keranjang di menu atas saya, menggunakan push-rightdan masalah saya adalah bahwa gelembung tarik-turun jatuh dari halaman. Saya mencoba menyelaraskan gelembung ke kanan, sehingga sejajar dengan 'klik'

seperti ini

HTML:

<div class="cart pull-right">
  <ul class="nav">
    <li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">CLICK</a>
       <div class="dropdown-menu">
       STUFF
       </div>
    </li>
  </ul>
</div>

Bootstrap 3.1+

Menambahkan kelas .dropdown-menu-right ke div yang sama yang berisi menu dropdown kelas:

<div class="dropdown-menu dropdown-menu-right">
    STUFF
</div>

http://getbootstrap.com/components/#dropdowns-alignment

Bootstrap 2.3 & 3.0

Tambahkan kelas .pull-right ke div yang sama yang berisi menu tarik-turun kelas

<div class="dropdown-menu pull-right">
    STUFF
</div>

Ini sepertinya berfungsi untuk saya menggunakan bootstrap 3.0

Ini dapat diselesaikan dengan kelas bootstrap dropdown-menu-right dengan dropdown-menuyang khusus untuk masalah ini yang menggunakan properti css right: 0;dan left: auto;menyelaraskannya ke kanan.

Solusi ini berhasil untuk saya.

Sumber - http://getbootstrap.com/components/#btn-dropdowns-dropup (buka alat pengembang untuk ini)

<div class="dropdown-menu dropdown-menu-right">

Ini masih berfungsi di boostrap 4.2.1 :)

dalam bootstrap v 3.1.0jawaban atas pertanyaan ini berbeda.

jsfiddle.dll

<div class="dropdown-menu pull-menu-right">
       STUFF
</div>

OK mengerti!

position:relative;left:0 di <ul class="dropdown-menu">