如何将btn-toolbar对齐到右边？

Question

我正在创建一个引导模态的页脚，我会将btn工具栏对齐到文本的右侧。 我尝试使用以下代码：

  <div class="modal-footer">
    <div class="text-center alert alert-danger">
      <p>confirm deletation?
        <span class="btn-toolbar pull-right">
          <button class="btn btn-success btn-flat fa fa-times"></button>
          <button data-dismiss="modal"
                  class="btn btn-success btn-flat fa fa-check"></button>
        </span>
      </p>
    </div>
  </div>

但我得到以下结果：

如您所见，右侧的按钮组未与文本对齐。如何解决？

Answer 1

我认为您需要使用内嵌类。

这样的事情，虽然你可能需要处理填充：

<div class="modal-footer">
  <div class="alert alert-danger">
    <div class="btn-toolbar inline pull-right"> 
      <button class="btn btn-success btn-flat inline fa fa-times"></button>
      <button data-dismiss="modal" class="btn btn-success btn-flat inline fa fa-check"></button>
    </div>
    <p>confirm deletation?</p>
  </div>
</div>

这是JSFiddle

Answer 2

添加此样式

style="margin-top: -5px;"

像这样：

  <div class="modal-footer">
    <div class="text-center alert alert-danger">
      <p>confirm deletation?
          <span class="btn-toolbar pull-right" style="margin-top: -5px;">
          <button class="btn btn-success btn-flat fa fa-times"></button>
          <button data-dismiss="modal"
                  class="btn btn-success btn-flat fa fa-check"></button>
        </span>
      </p>
    </div>
  </div>