Форум hotibo.ru

Сайты - по стандартам, но не стандартные сайты!






#1 28.11.2010 16:47

CrazyProger
Новичок
Зарегистрирован: 01.11.2010
Сообщений: 8

Резиновое меню

Нигде не найти примера - как сделать горизонтальное меню на всю ширину экрана или это невозможно?

Вот так я сделала меню на 5 ячеек:

Код:

#menubar {
    margin: 0;
    padding: 0;
    background: #ccd; }
#menubar ul {
    margin: 0;
    padding: 0;
    list-style: none; }
#menubar li {
    float: left;
    margin-left: -1px;
    width: 20%;
    text-align: center; }
#menubar a {
    margin: 0;
    padding: 0;
    border: 1px solid red;
    text-decoration: none;
    display: block; }

Блоку #menubar ширина не установлена => значит во весь экран, #menubar ul содержит в себе 5 ячеек, каждая по 20% родительской ширины. Сам список наследует ширину #menubar'a? Вроде все логично - но почему тогда меню не занимает всю ширину экрана, а справа остается некоторое место???

Нет на форуме

 

#2 28.11.2010 17:26

MT
Опытный
Откуда: Moscow
Зарегистрирован: 23.11.2009
Сообщений: 241
Вебсайт

Re: Резиновое меню

#menubar li {
    float: left;
    margin-left: -1px;
    width: 20%;
    text-align: center; }

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

Без использования табличной модели (например, путём использования display: table для нормальных таблиц и генерации настоящих таблиц для IE) полноценное резиновое меню нереализуемо.


браузер | блог

Нет на форуме

 

#3 28.11.2010 20:11

CrazyProger
Новичок
Зарегистрирован: 01.11.2010
Сообщений: 8

Re: Резиновое меню

Понятно sad

Нет на форуме

 

#4 22.01.2011 06:39

chel
Новичок
Зарегистрирован: 02.05.2010
Сообщений: 22

Re: Резиновое меню

MT написал:

Без использования табличной модели (например, путём использования display: table для нормальных таблиц и генерации настоящих таблиц для IE) полноценное резиновое меню нереализуемо.

как понять сию фразу в скобках?neutral


Нет на форуме

 

#5 22.01.2011 13:06

Бизон
Разбирающийся
Откуда: г. Жуковский МО
Зарегистрирован: 13.04.2010
Сообщений: 94
Вебсайт

Re: Резиновое меню

Блоку #menubar ширина не установлена => значит во весь экран

Нет, не значит. А 100% почему не укажите? Совсем не обязательно пользовать для таких вещенй таблицы.

Нет на форуме

 

#6 22.01.2011 14:26

MT
Опытный
Откуда: Moscow
Зарегистрирован: 23.11.2009
Сообщений: 241
Вебсайт

Re: Резиновое меню

chel написал:

MT написал:

Без использования табличной модели (например, путём использования display: table для нормальных таблиц и генерации настоящих таблиц для IE) полноценное резиновое меню нереализуемо.

как понять сию фразу в скобках?neutral

Для нормальных браузеров использовать display: table, для IE — генерировать реальную таблицу из списка.


браузер | блог

Нет на форуме

 

Board footer