Позиционирование элементов блока с помощью CSS

Question

Я пытаюсь получить макет более или менее, как показано ниже, но с фиксированной шириной для ссылок 'a': http://jsfiddle.net/9SnJQ/

Я могу указать фиксированную ширину путем изменения 'a'ссылки на блочные элементы, но потом я получаю следующую раскладку: http://jsfiddle.net/Fh943/

Как я могу получить лучшее от обоих (правильное позиционирование с фиксированной шириной)?

Answer 1

Несколько комментариев в начале:

1. Вы не должны использовать *. Способ анализа CSS - от ПРАВО к ВЛЕВО. Это означает, что браузер сначала проверяет последнее условие, в данном случае *, которое является КАЖДЫМ ЭЛЕМЕНТОМ НА СТРАНИЦЕ, а затем проверяет предыдущее условие и т. Д. Это самый НЕЭФФЕКТИВНЫЙ селектор, который вы можете использовать. Избегайте этого любой ценой!

2. Люди предлагают использовать встроенный блок. Это не будет работать в IE7 и не является обязательным

Хорошо, вот как я это сделал - рабочая демо

Answer 2

Используйте display: inline-block; для своих a тегов.Смотрите это обновленная скрипка .