How can I change the direction of a Twitter Bootstrap dropdown?
I have a dropdown like this:
But I want it to look like this:
Use data-offset or data-reference to change the location of the dropdown.
To override it, use . In your case, adding dropdown-menu-right class to the div that has the dropdown-menu class should do the trick. Show activity on this post. Use pull-right or pull-left classes.
Use the w3-right class to float the dropdown to the right, and use CSS to position the dropdown content (right:0 will make the dropdown menu go from right to left).
From http://getbootstrap.com/components/#dropdowns-alignment:
Deprecated .pull-right alignment
As of v3.1.0, we've deprecated .pull-right on dropdown menus. To right-align a menu, use.dropdown-menu-right
. Right-aligned nav components in the navbar use a mixin version of this class to automatically align the menu. To override it, use.dropdown-menu-left
.
In your case, adding dropdown-menu-right
class to the div that has the dropdown-menu
class should do the trick.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With