Равномерное пространство ссылок в div

Question

Я делаю простой сайт для колледжа, который я ненавижу из-за дизайна. Я программист PHP, а не дизайнер. (Может звучать глупо)

Я столкнулся с проблемой, у меня есть центрированный div 600 пикселей, а затем внутри тегов <nav> У меня 4 ссылки. Я бы хотел, чтобы они были равномерно распределены по всему DIV. Я попытался установить поля слева и справа, но безуспешно.

Взгляните на это на jsfiddle

Спасибо

Answer 1

Рабочая демонстрация: http://jsfiddle.net/8jK7N/1/

IE, однако, не поддерживает стилизацию новых элементов HTML5.Вы можете использовать Shiv для решения этой проблемы.Рабочая демоверсия (с Шив): http://jsfiddle.net/8jK7N/2/

Answer 2

Если вы удалите поле справа от nav a, оно будет работать.Добавленный интервал справа от поля добавляется в поле якоря.Вот как работает блочная модель: http://www.w3.org/TR/CSS2/box.html

Обратите внимание, что в IE селектор навигации html5, похоже, работает неправильно. Я добавил класс для тега абзаца и применилисправить этот тег.

Вот что будет работать во всех браузерах: http://jsfiddle.net/RkUWU/2/

Answer 3

Извлеките тег <p> из бита <nav>, а также 73px с полями влево и 73px с полями справа на каждой может сделать ссылки слишком широкими для одной строки в вашем div. Я знаю, что математика работает, но она может вести себя странно.

Answer 4

Вы можете использовать следующее:

nav a{
    width:150px; display:block;float:left;
}

Если хотите, то по центру добавьте:

text-align:center;