Не получается сделать горизонтальное меню адаптивным(CSS)

интернет css веб дизайн

Начал вчера пилить менюшку, сначала нашел одну подходящую но она была с js, а у меня его и так дофига, поискал, наткнулся на такую http://jemand.ru/examples/gorizontalnoe-vypadayushhee-menyu-na-css.html на примере все ок. Поставил себе, сначала пришлось погуглить на счет z-index, сделал, все как хотел. Но никак не могу сделать ее адаптивной, чтобы автоматически под разрешение подстраивалась. Сам шаблон был месяцами, перевернут вдоль и поперек, в зависимости от лени, какие то элементы добавлялись, какие то убирались.

Пытался сделать по разному, пихал всю конструкцию с ul и li в див в котором прописывал style="width: 100%; background-colour: #000;" не прокатывало. В самом css прописывал min-width, max-width = 100% тоже не прокатывает.

Что я делаю не так, помогите разобратся, вот сайт http://www.antoshabrain.ru/

Примечание:
Сайт на платформе blogger(blogspot), подскажите хотя бы как сделать заливку от последнего пункта "О блоге" до конца страницы. В идеале как применить на некоторые пункты резину, чтобы например системному администратору было в 1 строчку а не переносилось.

Примечание:
AdmGelax в том то и дело, я ставлю width: 100%; получается вот такое недоразумение https://dl.dropboxusercontent.com/u/99332327/img/menufail.png

Примечание:
AdmGelax спасибо с переносом разобрался. Поставил паддинг 4px... Убрал везде width, поставил только в свойстве menu width: 100% но все равно не тянется.

Примечание:
Другими словами не пойму как вытянуть линию меню на 100%

Примечание:
Большое вам спасибо, а то я уже опустил руки после нескольких часов возни!)
Ответы:
У вас сами элементы li имеют фиксированную ширину.
что бы слова не переносились, а были в одну строку, ширину нужно вообще убрать. и позиционировать текст внутри li средствами padding
тогда блок li будет иметь следующую ширину - ширина текста+padding
в #menu добавить height: 45px;


11 лет назад

RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.

Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.

Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.