html - Bootstrap 3 网格，对齐同一行中的列

Question

正如您在图片中看到的，我使用的是 bootstrap 3 网格系统，它们是 2 列，在同一行中，但它们没有对齐。我希望用户清楚他们处于同一级别，而就目前而言，它看起来很困惑。有人可以帮帮我吗？

谢谢

http://i.imgur.com/PFIE1oh.jpg

引导代码

<div class="col-sm-4 col-lg-4">
  <div class="row">
     <div class="col-sm-6 ">
         <h3>Total</h3>
     </div>
     <div class="col-sm-6 ">
         <h3>$1,618.20</h3>
     </div>
  </div>
</div>

Answer 1

它对我来说工作正常，只是它的对齐是正确的

实际上是class喜欢row , col不包含 margin-bottom或 padding-bottom

在<div class="col-sm-6 ">里面你用的是<h3>用于分配值，或者您也可以使用任何其他标签。在该分配标签中使用 style="margin-bottom:0px;padding-bottom:0px;" 这可能会解决您的问题

像这样

<div class="col-sm-4 col-lg-4">
  <div class="row">
     <div class="col-sm-6 ">
         <h3 style="margin-bottom:0px;padding-bottom:0px;">Total</h3>
     </div>
     <div class="col-sm-6 ">
         <h3 style="margin-bottom:0px;padding-bottom:0px;">$1,618.20</h3>
     </div>
  </div>
</div>  

或者你可以使用这个类

h3 {
margin-bottom:0px;
padding-bottom:0px;
}

希望这可能有用