Доработал свой первый вариант меню.
Теперь кнопки меню имеют одинаковое заполнение по ширине друг с другом, и занимает ту часть форума, какое кол-во кнопок будет у нас.
Открываем шаблон
navbar, после <br /> добавляем код менюшки.
PHP код:
<!-- nav buttons bar -->
<ul id="nav">
<li><a href="/" title="На главную страницу сайта">На главную</a></li>
<li><a href="index.php" title="На главную форума">Форум</a></li>
<li><a href="articles.php" title="Статьи, публикации, новости">Новости</a></li>
<li><a href="#" title="Связаться с нами">Контакты</a></li>
<li><a href="#" title="Часто задаваемые вопросы">FAQ</a></li>
</ul>
<!-- / nav buttons bar -->
Открываем
дополнительное определение CSS нашего стиля, добавляем:
PHP код:
#nav {
margin: 0 0 0 1px;
padding: 0;
float:left;
list-style: none;
background-color: #f8f9fc;
border: 1px solid #ccc;
border-right:0;
border-bottom:0;
}
#nav li {
display: inline-block;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
zoom: 1;
*display: inline;
width:100px;
text-align:center;
}
#nav li a {
display: block;
padding: 8px 15px;
text-decoration: none;
font-variant: small-caps
font-weight: lighter;
color: #01265f;
border-right: 1px solid #ccc; }
#nav li a:hover {
text-decoration: underline;
color: #B80000;
background-color: #f2f2f2; }
(здесь используем класс .nav - если в вашей системе такой класс есть, стоит заменить на свой).
Результат:
