1

編集:以前に持っていたものを削除しただけですが、以前のコーダーがこのコードをどこから取得したかがわかったので、これで質問したほうがよいと思いました。このページネーションを右揃えにしようとしていますが、正しく配置されません。

ここにフィドルがあります: http://jsfiddle.net/Zd8sC/5/ コードは次のとおりです: html:

<ul id="pagination-clean">
<li class="previous-off">«Previous</li>
<li class="active">1</li>
<li><a href="?page=2">2</a></li>
<li><a href="?page=3">3</a></li>
<li><a href="?page=4">4</a></li>
<li><a href="?page=5">5</a></li>
<li><a href="?page=6">6</a></li>
<li><a href="?page=7">7</a></li>
<li class="next"><a href="?page=2">Next »</a></li>
</ul>

CSS:

ul{border:0; margin:0; padding:0;}

#pagination-clean li{
border:0; margin:0; padding:0;
font-size:11px;
list-style:none;
}
#pagination-clean li, #pagination-clean a{
border:solid 1px #DEDEDE
margin-right:2px;
}
#pagination-clean .previous-off,
#pagination-clean .next-off {
color:#888888
display:block;
float:left;
font-weight:bold;
padding:3px 4px;
}
#pagination-clean .next a,
#pagination-clean .previous a {
font-weight:bold;
border:solid 1px #FFFFFF;
} 
#pagination-clean .active{
color:#00000
font-weight:bold;
display:block;
float:left;
padding:4px 6px;
}
#pagination-clean a:link,
#pagination-clean a:visited {
color:#0033CC
display:block;
float:left;
padding:3px 6px;
text-decoration:none;
}
#pagination-clean a:hover{
text-decoration:none;
}​
4

2 に答える 2

1 

div
{
    display: block;
    text-align: right;
}

#pagination-clean
{
    display: inline-block;
}
于 2012-09-17T18:41:31.427 に答える
0

あなたのdivタグの幅を設定します

<div style="width:200px;float:right"></div>

これにより、div タグが重なり合うことはありません。

于 2012-09-17T18:51:34.927 に答える