When using Bootstrap 3.2 and applying navbar-right to two different dropdown menus, they tend to overlap slightly. The code snippet below is taken directly from the Dropdown examples on the official Bootstrap website, but with the modification of having two dropdowns on the right side.
Please refer to the JSFiddle demo below. Ensure that the Result panel is wide enough to display the navbar, then hover over Dropdown 3 and 4 to see their borders overlapping.
If you have any suggestions or workarounds for this issue, they are greatly appreciated.
http://jsfiddle.net/codespelunker/ysqjt7fv/2
<ul class="nav navbar-nav navbar-right">
<li id="fat-menu" class="dropdown"> <a href="http://getbootstrap.com/javascript/#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 4 <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a>
</li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a>
</li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a>
</li>
<li role="presentation" class="divider"></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a>
</li>
</ul>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li id="fat-menu" class="dropdown"> <a href="http://getbootstrap.com/javascript/#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a>
</li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a>
</li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a>
</li>
<li role="presentation" class="divider"></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a>
</li>
</ul>
</li>
</ul>