引导模式页脚中的按钮对齐答案

【问题标题】：buttons aligment in bootstrap model footer引导模式页脚中的按钮对齐
【发布时间】：2016-11-19 11:08:50
【问题描述】：

enter image description here我正在模型页脚中添加按钮，但它没有对齐，而是下一行。

<div class="modal-footer">              
         <form method="post" action="admin_view">
           <a type="submit" name="accepted" value="<?php echo $object['id'];?>" class="btn btn-success">Accepted Job</a> 
          </form>

          <form method="post" action="reject_job">
             <a type="submit" name="rejected" value="<?php echo $object['id'];?>" class="btn btn-danger">Rejected Job</a> 
          </form>

          <button type="button" class="btn btn-default" data-dismiss="modal">close</button>
     </div>

【问题讨论】：

你没有将它们放在一行中，因为表单有一个 display:block;

标签： php html css twitter-bootstrap

【解决方案1】：

在 btn 中使用“pull-left”类。或者，如果您想正确，请使用“向右拉” 你需要更多帮助吗？去这个网址参考Bootstrap: change div order with pull-right, pull-left / 3 columns

<div class="modal-footer">              
         <form method="post" action="admin_view">
           <a type="submit" name="accepted" value="<?php echo $object['id'];?>" class="btn btn-success pull-left">Accepted Job</a> 
          </form>

          <form method="post" action="reject_job">
             <a type="submit" name="rejected" value="<?php echo $object['id'];?>" class="btn btn-danger pull-left">Rejected Job</a> 
          </form>

          <button type="button" class="btn btn-default pull-left" data-dismiss="modal">close</button>
     </div>

【讨论】：

【解决方案2】：

试试这个

<div class="modal-footer">  

   <div class="col-md-4">
       <form method="post" action="admin_view">
           <a type="submit" name="accepted" value="<?php echo $object['id'];?>" class="btn btn-success">Accepted Job</a> 
      </form>
   </div>

   <div class="col-md-4">
      <form method="post" action="reject_job">
           <a type="submit" name="rejected" value="<?php echo $object['id'];?>" class="btn btn-danger">Rejected Job</a> 
      </form>
   </div>

   <div class="col-md-4">
       <button type="button" class="btn btn-default" data-dismiss="modal">close</button>
   </div>

</div>

【讨论】：