クラス「の行は、」プルになり、右にもより

Question

と仮定Iコンテナ内の以下のブートストラップ改ページを持っている：私は<div class="row"> ... </div>に上記のコードをラップする場合は改ページは、テーブルで右にも多くの原因となるミスアライメントを引っ張る

<ul class="pagination pull-right"> 
    <li> 
     <a href="#" aria-label="Previous"> 
     <span aria-hidden="true">&laquo;</span> 
     </a> 
    </li> 
    <li><a href="#">1</a></li> 
    <li><a href="#">2</a></li> 
    <li><a href="#">3</a></li> 
    <li><a href="#">4</a></li> 
    <li><a href="#">5</a></li> 
    <li> 
     <a href="#" aria-label="Next"> 
     <span aria-hidden="true">&raquo;</span> 
     </a> 
    </li> 
    </ul> 

それはそれを上回っている。なぜこうなった？

ありがとうございました。

Answer 1

.rowの左右の余白は-15pxです。

.rowの子として、パディングを使用して負のマージンを打ち消す.col-xx-xxを追加する必要があります。

例：

<div class="row"> 
    <div class="col-sm-12"> 
    <ul class="pagination pagination-groups pull-right"> 
     <li> 
     <a href="#" aria-label="Previous"> 
      <span aria-hidden="true">&laquo;</span> 
     </a> 
     </li> 
     <li ng-repeat="i in range(tiGroupsData.total_pages) track by $index"><a href="#">{{$index+1}}</a></li> 
     <li> 
     <a href="#" aria-label="Next"> 
      <span aria-hidden="true">&raquo;</span> 
     </a> 
     </li> 
    </ul> 
    </div> 
</div>