布尔玛在分页元素的右侧放置一个元素

Question

我有一个布尔格pagination元素，我想将它放在HTML选项的右侧。我使用关卡组件来实现我的目标，但它不起作用。

这里是我的html代码：

<div class="level"> 
    <div class="level-left"> 
     <nav class="pagination"> 
      <a class="pagination-previous" disabled="disabled"> 
       <span class="icon is-small"><i class="fa fa-chevron-left"></i></span> 
      </a> 
      <a class="pagination-next"> 
       <span class="icon is-small"><i class="fa fa-chevron-right"></i></span> 
      </a> 
      <ul class="pagination-list"> 
       <li> 
        <a class="pagination-link is-current">1</a> 
       </li> 
       <li> 
        <a class="pagination-link">2</a> 
       </li> 
       <li> 
        <span class="pagination-ellipsis">…</span> 
       </li> 
       <li> 
        <a class="pagination-link">32</a> 
       </li> 
      </ul> 
     </nav> 
    </div> 
    <div class="level-right"> 
     <div class="select is-fullwidth"> 
      <select name="limit" id="limit"> 
       <option value="">Records per page:</option> 
       <option value="10">10</option> 
       <option value="15">15</option> 
       <option value="20">20</option> 
      </select> 
     </div> 
    </div> 
</div> 

这就是我得到：

你可以看到下次分页和上一个按钮被放置在靠近页码编号哪些不是默认行为。

有人可以帮忙请。

Answer 1

从我从布尔玛级组件看到的，它们不是全宽。

使用Chrome的督察或任何浏览器，你会看到什么布尔玛实际上做：

justify-content: space-between; 

这几乎是它。一个flexbox，以及space-between和命令，以确定什么是后面的。

所以布尔玛代码完美地工作，你的包含分页按钮的元素只是不够宽而不能成为全宽。如果你把它放大，你会看到你所说的默认行为。

如果我不够清楚，请考虑制作一个小提琴或片段的情况下，我可以更新以告诉你该怎么做。