Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Changing the direction of a Bootstrap dropdown

Tags:

How can I change the direction of a Twitter Bootstrap dropdown?

I have a dropdown like this:

What I have

But I want it to look like this:

What I want

like image 780
Rachid O Avatar asked Apr 23 '13 10:04

Rachid O


People also ask

How do I change the position of a drop down menu in Bootstrap?

Use data-offset or data-reference to change the location of the dropdown.

How do I change the direction of a dropdown in HTML?

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.

How do I align a dropdown to the right?

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).


1 Answers

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.

like image 71
kubilay Avatar answered Oct 08 '22 06:10

kubilay