Как сделать ширину меню css невозможной для изменения масштаба или изменения разрешения?

Я создаю шаблон Joomla, и у меня проблема с шириной меню, от которой я так и не нашел решения. Когда я создаю текстовое меню, некоторые элементы всегда идут в две строки при увеличении или изменении разрешения, например:

[ Пункт 1 ] [ Пункт 2 ] [ Пункт 3 ] [ Пункт 4 ] [ Пункт 5 ]

становится

[ Пункт 1 ] [ Пункт 2 ] [ Пункт 3 ] [ Пункт 4 ]

[ Пункт 5 ]

В общем, когда я создаю текстовое меню, ширина всегда будет меняться. Однако, если я сделаю его на основе изображения, проблема будет устранена, но его нельзя использовать для этого проекта, так как в нем слишком много пунктов меню, и некоторые из них могут быть изменены в будущем. Я видел сайт, который восстанавливает размер шрифта каждый раз, когда вы увеличиваете/уменьшаете масштаб сайта, чтобы сохранить заданную ширину сайтов, однако я больше этого не помню. У кого-нибудь из вас есть идеи? Должен быть какой-то скрипт, чтобы заставить текстовые меню иметь определенную ширину независимо от настроек размера шрифта браузера, масштабирования или разрешения экрана.

Заранее спасибо. Кстати, вот сайт: http://business.delux.lv/ Я действительно заметил много сайтов с этой проблемой, но у некоторых просто не так много пунктов меню, чтобы они когда-либо располагались в две строки, так что это как бы делает это не слишком заметным.


person ritmanis    schedule 03.07.2012    source источник
comment
Я думаю, ключ в том, чтобы использовать проценты вместо пикселей, попробуйте поиграть с этим   -  person BjarkeCK    schedule 03.07.2012


Ответы (2)


Добавьте это в стиль CSS меню

white-space:nowrap;
person Morad    schedule 03.07.2012

Добавьте эту строку в свой css:

#menu{width: 104%;}
person Farahmand    schedule 03.07.2012
comment
Возможно, вы захотите попробовать добавить еще несколько элементов li в свой список, потому что это не подходит для этой ситуации, вам, вероятно, потребуется установить для li ширину в процентах и ​​использовать размер шрифта %. - person Pricey; 04.07.2012
comment
Мне тоже помогло! - person Alexander Kim; 28.02.2014