ALICE+サポート ユーザー助け合い掲示板 TOPページ ユーザー助け合い掲示板 ページネーションを使いたい ユーザー助け合い掲示板 『ページネーションを使いたい』へのコメント投稿 記事 3 へのレス:>>1 パンくずとあんまし変わらないのでは?って思ったので お手軽に『inline-block』で作ってみたけど コレジャナイ感が半端ないのであくまで参考に 多分こういうアプローチで合ってると思うけど 横幅によってはぎっちぎちになったり広くなったりするんだろうから もしかしたら別かもしれないです。無責任で申し訳ない… /*-----------------------------------------------*/ 【HTML】 ##pagination## 【CSS】> a{text-decoration:none;} ul{text-align: center; list-style: none;} ul li{display: inline-block; /* ulタグとliタグをinline-block化 */ } .pagination{ /*<ul class="pagination">の部分*/ background: #059edc; } .pagination a{ /* <li><a></a></li> */ padding:10px; color:#333; background:#fff; border:solid 3px #FF0000; border-radius:.5em; margin-left:5px; } .pagination a:hover{ padding:10px; color:#fff; background:#a0d7f5; } .active{ /* <li><span class="active">3</span></li> */ font-weight:bold; color:#fff; background: #FF0000; padding:10px; border:solid 3px #FF0000; border-radius:.5em; margin-left:5px; } </style> /*-----------------------------------------------*/ 以下は自分用メモ ・フォント次第ではうまくいく? →等幅フォント? ・marginで無理やり左側に空間をつくる →.pagination a{}/.active{} margin-left:5px; ・float →横並びにはなるけれど表示が× ・block →width×height× ▼お名前 ※最大20文字 ▼コメント ※最大10000文字 HTMLタグは使えません>>3 ▼画像添付(4個まで選択可) サクッとコメント スレッドへ 掲示板TOPへ ALICE+サポート