Twitter bootstrap dropdown goes outside the screen

Since Bootstrap v3.1.0 adding .pull-right is deprecated on dropdown menus. A .dropdown-menu-right should be added to ul.dropdown-menu instead. Docs


a solution that does not need modifying the HTML only the CSS is

li.dropdown:last-child .dropdown-menu {
  right: 0;
  left: auto;
}

Its particularly usefull for dynamically generated menus where its not always possible to add the recommended class dropdown-menu-right to the last element


For Bootstrap 4, adding dropdown-menu-right works. Here's a working example..

http://codeply.com/go/w2MJngNkDQ


adding .pull-right to ul.dropdown-menu should do it

Deprecation Notice: As of Bootstrap v3.1.0, .pull-right on dropdown menus is deprecated. To right-align a menu, use .dropdown-menu-right.

Deprecation Notice 2: As of Bootstrap v5, .dropdown-menu-right is deprecated. For Bootstrap v5, use .dropdown-menu-end.