0
will_paginate 젬에서 제공하는 샘플 코드와 CSS를 사용하여 내 페이지에 멋지게 페이지 매기기 컨트롤을 제공하고 있습니다. 그러나 컨트롤은 가로로 정렬되지 않습니다. 대신, 모두 세로로 겹쳐서 페이지 중앙에 배치됩니다. 하나의 수평선에서 어떻게 얻을 수 있습니까? HTML은 http://mislav.uniqpath.com/will_paginate/will_paginate 페이지 매김 도구가 가로로 정렬되지 않았습니다.
:
<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;
}
가로로 정렬했는데 모두 중앙에 놓여있는 그룹 대신 블록의 왼쪽에 붙어 있습니다. –
그게 전부 였어. apple_pagination {display : inline-block}도 추가했습니다. 이제 전체 블록이 왼쪽 정렬되고 컨트롤이 가로로 정렬됩니다. 이 경우에는 저에게 효과적입니다. –