4

I'm using angular ui.bootstrap and I've had success creating a simple drop down menu, but when you put the menu at the bottom of the page, it goes off the page. Is there a way to make it open in the UP direction?

Thanks! -fotoflo

1

4 Answers 4

13

you can use the dropup class with Angular UI Bootstrap like so:

 <div class="btn-group dropup" dropdown>
      <button type="button" class="btn btn-danger">Action</button>
      <button type="button" class="btn btn-danger dropdown-toggle" dropdown-toggle>
        <span class="caret"></span>
        <span class="sr-only">Split button!</span>
      </button>
      <ul class="dropdown-menu" role="menu">
        <li><a href="#">Action</a></li>
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
        <li class="divider"></li>
        <li><a href="#">Separated link</a></li>
      </ul>
    </div>
Sign up to request clarification or add additional context in comments.

Comments

0

Seems that Bootstrap has a built in class for dropdowns called dropdown up!

Comments

0

Yeah, just next to your dropdown class add dropup :)

Comments

0

Bootstrap 4 is using this option by default.

Here is the link for more information

1 Comment

Please add the relevant piece of code or advice to the answer (in addition to the link). As links may change or not work in the future and make the answer incomplete.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.