Question

我正试图把我的2个分页放在我桌子的垂直距离上。

这适用于底部，但由于某种原因，顶部似乎在我的表容器中。

CSS：

.table {
    width: 100%;
    max-width: none;
    clear: both;
}
.table-container {
    margin-top: 20px;
    margin-bottom: 20px;
}
section {
    margin-top: 20px;
    margin-bottom: 20px;
}
.pagination {
    display: inline;
}

Answer 1

要解决间距问题，请更改

.pagination {
  display:inline-block;
}

到

.pagination {
  display:inline; //or block
}

你也应该将你的.pagination包装在这样的.col-xs-12 .col-md-12 div中。始终包含xs类，因为Bootstrap首先是移动的。

<div class="row>
 <div class="col-xs-12 col-md-12">
  <ul class="pagination">
    //code
  </ul>
   //rest of code
 </div>
</div>

另外，这个

<section>
 <div class="col-xs-2 col-md-2"></div>
 <div class="col-xs-8 col-md-8">
   //code
 </div>
</section>

应该是

<section>
  <div class="row>
    <div class="col-xs-2 col-md-2"></div>
    <div class="col-xs-8 col-md-8">
      //code
    </div>
  </div>
</section>

作为docs州

内容应放在列中，并且只能列行的直接孩子。

Answer 2

您的行没有边距。其他东西正在影响它们在行内。例如，您有changesOperation.fetchDatabaseChangesCompletionBlock = { newToken, more, error in guard error == nil else { if let ckerror = error as? CKError { // ... Handle the CKError } return } // ... Do something useful }是<div class="pagination">。如果删除它，则底部display:inline-block边距会消失。

将2个元素放置在表

2 个答案: