VPF::слой слева и права - Форум программистов

MrDmitry

Дата 23.4.2012, 12:38 (ссылка)

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

Загрузка ...

Опытный

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

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

Здраствуйте, может кто нибудь подскажет как можно прижать дивы к левому краю и к правому. Делаю не большое простенькое меню, нужно чтоб пункты меню располагались с разных сторон прижатые к разным краям. Написал так:

Код


.menu-left.first {
    background: #373737;
    height:60px;
    width:170px;
    border-right: 2px solid #42aaff;
    border-bottom: 2px solid #42aaff;
    -moz-border-radius-bottomright: 12px;
    -webkit-border-bottom-right-radius: 12px;
    border-bottom-right-radius: 12px;
 }

.menu-left.middle {
    background: #373737;
    height:60px;
    width:170px;
    border-right: 2px solid #42aaff;
    border-bottom: 2px solid #42aaff;
    -moz-border-radius-topright: 12px;
    -webkit-border-top-right-radius: 12px;
    border-top-right-radius: 12px; 
    -moz-border-radius-bottomright: 12px;
    -webkit-border-bottom-right-radius: 12px;
    border-bottom-right-radius: 12px;
 }

.menu-right.first {
    float:right;
    background: #373737;
    height:60px;
    width:170px;
    border-left: 2px solid #42aaff;
    border-bottom: 2px solid #42aaff;
    -moz-border-radius-bottomleft: 12px;
    -webkit-border-bottom-left-radius: 12px;
    border-bottom-left-radius: 12px;
 }

.menu-right.middle {
   float:right;
    background: #373737;
    height:60px;
    width:170px;
    border-left: 2px solid #42aaff;
    border-bottom: 2px solid #42aaff;
    -moz-border-radius-topleft: 12px;
    -webkit-border-top-left-radius: 12px;
    border-top-right-radius: 12px; 
    -moz-border-radius-bottomleft: 12px;
    -webkit-border-bottom-left-radius: 12px;
    border-bottom-left-radius: 12px;
 }

Код


    <div class="menu-left first"></div>
    <div class="menu-left middle"></div>
    <div class="menu-left middle"></div>
    <div class="menu-left middle"></div>
    
    <div class="menu-right first"></div>
    <div class="menu-right middle"></div>
    <div class="menu-right middle"></div>
    <div class="menu-right middle"></div>

ksnk

Дата 23.4.2012, 14:30 (ссылка)

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

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

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

В контейнеры обернуть?
http://jsfiddle.net/kEcgp/

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

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