Css Can';t将按钮与面板标题对齐

Css Can';t将按钮与面板标题对齐,css,twitter-bootstrap-3,Css,Twitter Bootstrap 3,我有一个我称之为棘手的问题。我想将两个按钮与面板标题对齐,并将它们对齐。然而,当我把它们放进去时,我得到了: 订单摘要详细信息打印摘要 我想要的结果是按钮与标题在同一行上对齐 谢谢 您可以设置绝对按钮的位置: <span class="pull-right" style="position: absolute;top: 2px;right: 21px;"> <button type="button" class="btn btn-primary pull-rig

我有一个我称之为棘手的问题。我想将两个按钮与面板标题对齐,并将它们对齐。然而,当我把它们放进去时,我得到了:


订单摘要详细信息打印摘要
我想要的结果是按钮与标题在同一行上对齐


谢谢

您可以设置绝对按钮的位置:

<span class="pull-right" style="position: absolute;top: 2px;right: 21px;">
     <button type="button" class="btn btn-primary pull-right">Print Summary</button>
     <a href="#event.buildlink(rc.printLabel)#?label=#order_id#" onclick="window.open(this.href,'_blank','toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=700,height=300'); return false;" role="button"> <button type="button" class="btn btn-primary">Print Label</button></a>
</span>

打印摘要

您可以设置按钮的绝对位置:

<span class="pull-right" style="position: absolute;top: 2px;right: 21px;">
     <button type="button" class="btn btn-primary pull-right">Print Summary</button>
     <a href="#event.buildlink(rc.printLabel)#?label=#order_id#" onclick="window.open(this.href,'_blank','toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=700,height=300'); return false;" role="button"> <button type="button" class="btn btn-primary">Print Label</button></a>
</span>

打印摘要

另一种解决方案可以是这样的:

<div class="row">
  <div class="col-md-12">
    <div class="panel panel-default">
      <div class="panel-heading" style="height: 40px;">
        <h3 class="panel-title"><strong>Order Summary Details</strong></h3>
        <div style="margin-top: -25px;" class="pull-right">
          <button type="button" class="btn btn-primary">Print Summary</button>
          <a href="#event.buildlink(rc.printLabel)#?label=#order_id#" onclick="window.open(this.href,'_blank','toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=700,height=300'); return false;" role="button" class="btn btn-primary">Print Label </a>
        </div>
      </div>
    </div>
  </div>
</div>

订单摘要详细信息
打印摘要

另一种解决方案可以是这样的:

<div class="row">
  <div class="col-md-12">
    <div class="panel panel-default">
      <div class="panel-heading" style="height: 40px;">
        <h3 class="panel-title"><strong>Order Summary Details</strong></h3>
        <div style="margin-top: -25px;" class="pull-right">
          <button type="button" class="btn btn-primary">Print Summary</button>
          <a href="#event.buildlink(rc.printLabel)#?label=#order_id#" onclick="window.open(this.href,'_blank','toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=700,height=300'); return false;" role="button" class="btn btn-primary">Print Label </a>
        </div>
      </div>
    </div>
  </div>
</div>

订单摘要详细信息
打印摘要

这很好,也很简单。还有一个问题?有没有办法在按钮之间留出一个空间?我试过了,但似乎没有用。这很好,很简单。还有一个问题?有没有办法在按钮之间留出一个空间?我试过了,但似乎没用