布爾瑪在分頁元素的右側放置一個元素

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和命令，以確定什麼是後面的。

所以布爾瑪代碼完美地工作，你的包含分頁按鈕的元素只是不夠寬而不能成爲全寬。如果你把它放大，你會看到你所說的默認行爲。

如果我不夠清楚，請考慮製作一個小提琴或片段的情況下，我可以更新以告訴你該怎麼做。