Не могу сделать нормальное резиновове меню. Намутил где-то.

[VasyOK{!}]

Привет верстальщики!

Короче такая трабла: Пытаюсь сделать кнопки как на картинке.

При уменьшении размера окна меню сползает вниз. Верстка тут: http://adaptivetest....ps-private.net/

Как это исправить?

Сейчас прописал так, но видно что-то не учел:

#block-system-main-menu {

width: 73%;

float: left;

}

#block-system-main-menu ul {

margin: 0;

}

#block-system-main-menu .menu li {

float: left;

list-style: none outside none;

margin: 0;

padding: 0;

height: 128px;

width: 33%;

}

#block-system-main-menu .menu a {

background-color: #FE8B00;

background-position: center top;

background-repeat: no-repeat;

color: #2E2E2E;

display: block;

font-size: 16px;

font-weight: bold;

text-align: center;

text-transform: uppercase;

padding: 104px 0 0;

}

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

Edited September 24, 2013 by VasyOK{!}

[klierik]

а как оно должно выглядеть при малой ширине экрана?

сам подумай, ведь при текущих настройках оно не влазит, поэтому слетает. надо что-то в самом меню менять.

[VasyOK{!}]

klierik, меню должно быть как на картинке. А у меня оно сползает.

или вот так должно быть http://dev.youradman.com/ - но тут быдло-код. Тоже мой.

А на проблемном сайте вот так: http://adaptivetest.u5154.ph.vps-private.net/ Я хочу сделать по нормальному без всяких Медиа кверри Он Скрин - но не получается.

[klierik]

оно сползается потому что ширина экрана меняется.

поставь фикс. ширину при любой ширине окна и никуда не попалзет.

[VasyOK{!}]

оно сползается потому что ширина экрана меняется.

совершенно верно!

А что нельзя сделать чтобы не сползало вниз при изменении ширины?

Edited September 25, 2013 by VasyOK{!}

[klierik]

совершенно верно!

А что нельзя сделать чтобы не сползало вниз при изменении ширины?

Ну ты сам подумай -- как оно будет не сползать если ему не хватает ширины?

Вот если тебя посадить комнату, у которой опускается потолок, тебе рано или поздно прийдется присесть, так как тебе не будет хватать высоты.

Тут тоже самое. Что бы оно не слетало требуется что бы контейнер не был меньше допустимой ширины.

[VasyOK{!}]

Ну допустим я бы присел. Но мне не нужно для этого делать шаг в сторону.

С шириной меню у меня все нормально - ширина сжимается. Но само меню делает шаг вниз:

Edited September 26, 2013 by VasyOK{!}

[klierik]

дажно. стоишь ты по центру комнаты. смотриш вперед.

сжимаем стены. доходит до плеч, тебя давит, ты что делаешь - поворачиваешься. но ведь тебе надо стоять прямо, правильно? как это возможно если тебя давят стены?

так вот в нашем случае меню это ты. в окно браузера и его ширина это стены.

если ему не хватает места, то оно свалится туда где место есть.

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