1

I am trying to make multiple buttons to look like menu in following code

<div class="btn-group" uib-dropdown>
      <button id="" type="button" class="btn btn-primary" uib-dropdown-toggle>
        Inline Dropdown
      </button>
      <ul uib-dropdown-menu>
        <li role=""><a href="#">Action</a></li>
        <li role=""><a href="#">Another action</a></li>
      </ul>
    </div>
    <div class="btn-group" uib-dropdown>
      <button id="" type="button" class="btn btn-primary" uib-dropdown-toggle>
        Inline Dropdown
      </button>
      <ul uib-dropdown-menu>
        <li role=""><a href="#">Action</a></li>
        <li role=""><a href="#">Another action</a></li>
      </ul>
    </div>

Everything is working fine but there is small whitespace between two divs.How can i resolve the same.

The plunker for the same is here : https://plnkr.co/edit/W8d74Qpqm4p4oLJnNXgT?p=preview

1
  • 2
    The .btn-group and/or .dropdown class needs to be floated. If you float left on the class the space between the two disappears. Commented Apr 17, 2017 at 15:02

2 Answers 2

2

You may want to use a navbar element instead o several dropdowns. If you want to remove the whitespace try this:

.btn-group {
   display:block;
}
Sign up to request clarification or add additional context in comments.

Comments

0

On the second div use inline styling or edit the original class:

style="margin-left:-4px"

OR

.btn-group {
display:block;
}   

Comments

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.