WordPressを使っている方で記事数が多くなった場合のページャーで「WP Page Numbers」を使っている方も少なくないはず。
実際に使ってみると便利ですよね。
設置方法とかその他諸々は置いといて、この「WP Page Numbers」を使うと最終的に以下のようなコードが生成されます。
そしてこのコードに対して「WP Page Numbers」のデフォルトテーマを使用していると選択したテーマのCSSが生成されます。
そのCSSだとliをfloatしているのでページの中央に配置ができない・・・
なんだか気持ち悪いので中央に揃えたろうじゃないか！
実はpositionを使えばしっかり中央に揃います。
#wp_page_numbers {
position:relative;
padding-bottom:30px;
}
#wp_page_numbers ul {
position: relative;
left: 50%;
float: left;
}
#wp_page_numbers ul li {
position: relative;
left: -50%;
float: left;
}
これで最低限の中央配置は完了です。
ちなみに当ブログでは
#wp_page_numbers {
position:relative;
padding-bottom:30px;
}
#wp_page_numbers ul {
position: relative;
left: 50%;
float: left;
}
#wp_page_numbers ul li {
position: relative;
left: -50%;
float: left;
list-style:none;
}
#wp_page_numbers ul li a {
display:block;
padding:3px 5px;
margin:5px;
border:1px solid #3a87ad
}
#wp_page_numbers ul li a:hover {
background:#3a87ad;
color:#fff;
text-decoration:none;
}
#wp_page_numbers ul li.active_page a {
background:#3a87ad;
color:#fff;
}
としています。（ご参考までに）
これでスッキリ気持ちよくブログライフが楽しめますね！
追記
肝心なことを書き忘れていますた。
WP Page Numbersの設定で最初の方に「Include theme stylesheet for page numbers」とあります。
WP Page Numbersのデフォルトのスタイルを使うか使わないかのチェックです。
これを使わない。要するにチェックを外すのを忘れないようにお願いします。
(上に書いた内容で通じるかと思いましたが・・・)
