自定义选项卡列表上的Bootstrap下拉对齐

Question

我有自定义标签列表。这是一个js小提琴：http://jsfiddle.net/tudap/3/。

我的中间有“更多”选项。如果我点击下拉箭头，下拉总是留下来。任何标签都是这种情况。有人可以建议解决这个问题吗？

<ul class="topmenu">
                    <li class="selected"><a href="#">Option1<br>&nbsp;<span></span>   </a></li>
                    <li><a href="#"> Option1   <br> <span>0</span></a></li>                    

                        <li><a href="#">Option1 <br> <span> 5</span> </a></li>
                        <li><a href="#">Option2  <br>  <span>6</span>  </a></li>

                             <li class="dropdown">
                                <a data-toggle="dropdown" class="dropdown-toggle" href="#">More <br><b class="caret"></b></a>
                                <ul class="dropdown-menu">
                                    <li><a href="#">Option6 </a></li>
                                    <li><a href="#">Option7</a></li>
                                    <li><a href="#">Option8</a></li>
                                </ul>
                            </li>   

                          <li><a href="#">Option3   <br> <span>7</span>  </a></li>
                        <li><a href="#">Option4   <br> <span>8</span> </a></li>                                 

                </ul>

更新

我添加了右对齐代码并将“更多”移至右侧

http://jsfiddle.net/tudap/5/