|
 5.2 Кб |
|
| Столкнулся с одной проблемой, и никак не могу ничего с ней сделать. Суть:
<div class="item-list">
<ul class="pager">
<li class="pager-numbers first">Page 2 of 3</li>
<li class="pager-previous"><a href="/node" title="Go to previous page" class="active">‹ previous</a></li>
<li class="pager-item"><a href="/node" title="Go to page 1" class="active">1</a></li>
<li class="pager-current">2</li>
<li class="pager-item"><a href="/node?page=2" title="Go to page 3" class="active">3</a></li>
<li class="last"><a href="/node?page=2" class="active">Next ››</a></li>
</ul></div>
|
никак не могу сделать подчеркивание активного элемента так, как это показано на прилагающейся картинке, все время нижняя граница активного элемента оказывается ниже границы всего пейджера
http://radikal.ua/data/upload/05615/05615/aedf80a7ba.png | |
|
|
|
|
|
|
|
для: red_komrad
(05.03.2011 в 01:58)
| | На примере элемента псевдокласса hover:
<style>
.pager{display:block; list-style:none; border-bottom:3px solid #777; float:left; width:100%}
.pager li{float:left;font-size:18px; font-family:arial; display:block; color:#444}
.pager li a{font-size:18px; font-family:arial; padding:3px 10px; color:#444; text-decoration:none}
.pager li a:hover{background:#eee; border-bottom:3px solid red; padding-bottom:0;}
</style>
|
Особое внимание на строку ".pager li a:hover{background:#eee; border-bottom:3px solid red; padding-bottom:0;}" - паддинг убираем, на его место встает бордер. | |
|
|
|