Строка меню CSS для увеличения ширины страницы

#css #menu #width

#css #меню #ширина

Вопрос:

Я бы хотел, чтобы главное меню было с этой страницыhttp://www2.gardencomedyclub.co.uk чтобы использовать всю ширину страницы. Я пробовал использовать margin: 0 auto; в разных местах #menu css-тегов, но он продолжает выравниваться по левому краю. Я бы просто хотел, чтобы расстояние между li элементами было увеличено, чтобы заполнить всю ширину #mainmenu div. Спасибо за любую помощь!

1. Похоже, что ваш макет довольно статичен, а пункты меню выглядят так, как будто они почти заполнили все доступное пространство. Почему бы не задать статическую ширину для нескольких пунктов меню, чтобы использовать оставшееся пространство?

2. Я понимаю. Итак, вы говорите, что либо определяете фиксированную ширину для пунктов меню, либо добавляете немного определенных отступов / полей, чтобы выделить пространство?

3. Я согласен с Брэндоном. Ширина вашего меню не изменится, поэтому просто измените поле #menu a на margin: 0 6px; . Кнопки теперь хорошо вписываются, плюс они могут немного «дышать».

4. На самом деле у меня это было некоторое время назад, и все это, казалось, хорошо подходило, когда я тестировал в Chrome, safari и всех моих мобильных браузерах. Однако, когда я тестировал в firefox, About элемент был перенесен на новую строку…

Ответ №1:

В вашем #menu li удалите float: left и вместо этого используйте display:inline-block. Однако это приведет к перемещению последнего li в новую строку. Чтобы решить эту проблему, вам нужно будет изменить поля и отступы для «a» на margin: 0 1px и padding: 0 1px. Это работает в IE9, FF4.01, GG11, AF5.0.5 и Opera 11.

Ответ №2:

Для margin:0 auto; работы вам необходимо установить width .

Используйте width:730px; на #menu , и это должно сработать.

1. Для меня это работает. Я проверил в Chrome. У вас тоже работает. Лучше, если он хочет, чтобы между элементами было одинаковое пространство. Мой просто центрирует весь список.

2. проверьте еще раз в IE9 и FF4.01