Нестандартное меню

Друзья, поздравляю всех с наступившим Новым годом! Желаю дальнейшего профессионального роста!
Собственно, это вступление. А тепепь по теме.
Есть вот такое меню. У активного пункта и при наведении на ссылку значительно увеличивается размер текста.
Подскажите, пожалуйста, как сверстать это безобразие, чтобы сохранить отступы между элементами меню и при этом избежать дергания?

На первый взгляд, ничего кроме ручного прописывания всех размеров в голову не приходит

На второй - не увеличивать ссылку, а дублировать. Нижняя задает размер меню. Верхняя имеет position:absolute. И проявляется при наведении за счет смены з-индекса.
Задачка интересная, но потом вас убьет тот, кто будет в цмс интегрировать )

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

Почему невозможно? Не от балды задавать, а выверить тщательно. Это более правильное решение, чем второе.

Таблицу делайте с фикс. шириной ячеек.

AlekartRu, И что будет?

Цитата ("floppox"):

Почему невозможно? Не от балды задавать, а выверить тщательно. Это более правильное решение, чем второе.

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

640miles, ну так понятно, что при наведении отступы будут уменьшаться ровно настолько, насколько увеличивается ширина надписи. Или вы спрашиваете совета, как арифметику хакнуть?

NeoMurderer, а что именно там работает?

Цитата ("floppox"):

AlekartRu, И что будет?

Каждый пункт меню в своей ячейке. При увеличении текста ссылки в одной ячейке остальные будут оставаться на своих местах.

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

Цитата ("floppox"):

640miles, ну так понятно, что при наведении отступы будут уменьшаться ровно настолько, насколько увеличивается ширина надписи. Или вы спрашиваете совета, как арифметику хакнуть?

Просто ищу максимально универсальное решение

Максимально универсальное - javascript, который вычисляет размер блока до и после увеличения, корректирует отступы.

Цитата ("floppox"):

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

Не понял задачу. Ну да ладно. Посмотрите готовые разные меню на джиквери, может найдёте то, что подойдёт.

Цитата ("AlekartRu"):

Таблицу делайте с фикс. шириной ячеек.

Не выйдет. Ячеуки все равно растянет.

Цитата ("640miles"):

Просто ищу максимально универсальное решение

Заменить текст картинками одного размера.

Либо играть css. Что-то вроде такого
my_block {
font-size: 12px;
line-height: 1.5;
padding: 10px 30px;
}
my_block:hover {
font-size: 18px;
line-height: 1;
padding: 5px 15px;
}

Пока остановилась на этом посилання

"Контактная информация" почему-то вправо прыгает. В остальном - идеально

Цитата ("640miles"):

Пока остановилась на этом

При фиксированной ширине есть некоторый шанс, что у пользователя все же развалится дизайн. Тестируйте на самом широком шрифте и дайте запас по ширине.

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