簡體   English   中英

will_paginate 分頁控件未水平對齊

[英]will_paginate pagination controls are not horizontally aligned

我正在使用 will_paginate gem 提供的示例代碼和 CSS 在我的頁面上提供格式良好的分頁控件。 但是,控件不會水平對齊。 相反,它們都垂直堆疊並在頁面上居中。 我怎樣才能把它們放在一條水平線上?

示例代碼來自: http : //mislav.github.io/will_paginate/

HTML是:

<div class="apple_pagination">
  <div class="page_info">
    <%= page_entries_info @feeds %>
  </div>
  <%= will_paginate @feeds, :container => false %>
</div>

CSS是:

.apple_pagination {
  background: #f1f1f1;
  border: 1px solid #e5e5e5;
  text-align: center;
  padding: 1em;
  cursor: default;
  li {  list-style: none;  }
}

.apple_pagination a, .apple_pagination span {
  padding: 0.2em 0.3em;
}

.apple_pagination .disabled {
  color: #aaaaaa;
}

.apple_pagination .current {
  font-style: normal;
  font-weight: bold;
  background-color: #bebebe;
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  line-height: 1.5;
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
  border-radius: 1em;
  text-shadow: rgba(255, 255, 255, 0.8) 1px 1px 1px;
}

.apple_pagination a {
  text-decoration: none;
  color: black;
}

.apple_pagination a:hover, .apple_pagination a:focus {
  text-decoration: underline;
}

嘗試使用 float:left 顯示按鈕;

.apple_pagination a{
   float:left
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM