VPF::"Резиновый" фон для меню навигации

oXyd

Дата 14.7.2008, 15:33 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 14
Регистрация: 11.7.2008

Репутация: нет
Всего: нет

bars80080, видимо не получится, дисплай уже задан - block

Цитата

Недавно начал заниматься версткой, с блочной вообще чуть меньше недели назад познакомился, многое еще не понятно.

oXyd

Дата 18.7.2008, 19:11 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 14
Регистрация: 11.7.2008

Репутация: нет
Всего: нет

Проблема все еще актуальна, есть ли способ выровнять меню по центру экрана не убирая флоат?

Код


<div id="navigation"> 
        <div id="nav">
             <ul class="nav-menu">
                    <li class="current"><a href="index.html"><b>О нас</b></a></li>
                    <li><a href="index1.html"><b>Контактная информация</b></a></li>
                    <li><a href="index2.html"><b>Рекламодателям</b></a></li>    
                    <li><a href="index3.html"><b>Каталог компаний</b></a></li>                     
             </ul>
        </div>
   </div>

Код


#navigation {
    text-align:center;
    margin-left: auto; margin-right: auto;
}

#nav {
    font-size:130%;
    background:url(images/nav.png) repeat-x;
    padding:0;
    margin-left: auto; margin-right: auto;
}

#nav a {
    margin:0px 18px 0px 18px;
    color:#0857a6;
    padding-bottom:20px;
}

.nav-menu{
    position: relative;
    padding: 0;
    margin:0;
    height: 37px;
    list-style: none;
    margin-left:18%;
}

.nav-menu li{
    display:inline;
}

.nav-menu li a{
    float: left;
    display: block;
    color:#000;
    font-family: sans-serif;
    font-size: 90%;
    font-weight: bold;
    padding:0 0 0 7px;
    height: 37px;
    line-height: 37px;
    cursor: pointer;
    text-decoration:underline;
}

.nav-menu li a b{
    float: left;
    display: block;
    padding: 0 16px 0 8px;
    text-decoration:underline;
}

.nav-menu li.current a{
    color: #fff;
    background: url(images/nav_left.png) no-repeat;
    background-position: left top;
    margin:0;
    text-decoration: none;
    font-weight:800;
}

.nav-menu li.current a b{
    color: #fff;
    background: url(images/nav_ri.png) no-repeat right top;
    text-decoration: none;
    font-weight:900;
}

oXyd

Дата 3.8.2008, 16:05 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 14
Регистрация: 11.7.2008

Репутация: нет
Всего: нет

Решил проблему с центрированием меню.

bars80080, Ваш способ оказался верным(присвоить боковым маргинам авто, родительскому блоку текст по центру можно не задавать), однако Вы забыли про одну деталь, без которой он не работает. Для блока меню должна быть обязательно задана ширина.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »