Ширина контейнера, определяемая полужирным шрифтом

Question

Я делаю веб-страницу с помощью меню с помощью ul и плавающего li. Чтобы отличить активную страницу от других страниц, а также когда я наводил ссылку на ссылку, текст становится полужирным.

Проблема, с которой я сталкиваюсь, заключается в том, что когда текст становится полужирным, он подталкивает все вокруг в меню. (См .: http://jsfiddle.net/tVDaf/)

Одно из возможных решений, о которых я думал, заключалось в определении ширины каждого пункта меню по размеру выделенного полужирным шрифтом, но я не знаю, возможно ли это (по крайней мере, без использования javascript).

Любые предложения?

Answer 1

Я вижу три варианта для вас. Последнее, вероятно, ваш лучший выбор:

1. Использование JavaScript
2. Используйте моноширинный шрифт
3. Установите ширину на li теги

Answer 2

только действительно способ сделать это, чтобы установить каждый li до определенной ширины, потому что теперь он установлен в ширину якоря внутри него. обычно не рекомендуется применять смелые над анкерами, но вместо этого менять цвета.

Answer 3

Быстрый грязный взломать (чтобы избежать javascript), try to reduce padding on hover.

Answer 4

Если вы не можете установить ширину, это означает, что ширина изменится по мере того, как текст станет полужирным. Невозможно избежать этого, кроме как с помощью компромиссов, таких как изменение отступов/полей для каждого состояния.

всех кредитов этого ответа являются для Andrew Vit, если он помог вам проголосовать свой комментарий здесь: Inline elements shifting when made bold on hover

и, пожалуйста, поищите на форуме, прежде чем отправлять, потому что я видел это идущий на много