下拉没有在模态标题中正确放置

Question

我有一个bootstrap-modal，带有页眉，正文和页脚。

现在我将向下添加一个带有下拉菜单的下拉按钮到模态标题。按钮放置正确但如果我打开菜单，则菜单位于中间。

这里是代码：

<div class="modal-header">
   <div class="row">
      <div class="col-xs-6">
         <h4 class="modal-title" id="myModalLabel">Max Muster</h4>
      </div>
      <div class="col-xs-6 text-right">
         <div class="dropdown open">
            <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
            <i class="fa fa-plus"></i>
            <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
               <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
               <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
               <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
               <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
            </ul>
         </div>
      </div>
   </div>
</div>

有什么建议吗？

提前致谢。

Answer 1

您位于第二列col-xs-6中。

<div class="row">
    <div class="col-xs-6">First column</div>
    <div class="col-xs-6">Second column</div>
</div>

第二列的开头位于左侧，因此您必须设置类向右拉

<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dropdownMenu1">

http://jsfiddle.net/9nf0afa5/