Выровненное по ширине меню CSS, не работающее без разрывов строки между <литием>

Я разрабатываю пользовательский шаблон Wordpress для некоторых друзей и хочу горизонтально выровненное по ширине главное меню. Все были бы в порядке, за исключением того, что wp_page_menu выводы элементы списка все в одной строке, который (после того, как МНОГО! из царапания головы), кажется, повреждает форматирование и удаляет все пространство между элементами. Например, следующие выводы 1, 2 и 3 растянутых и затем 456 все вместе. (Протестированный в Safari, Firefox и Chrome, всех на Mac)

<style>

.menu {
    text-align: justify;
    width: 700px;
    margin: 10px;
}

.menu * {
    display: inline;
}

.menu span {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 0;
}

</style>

<div class="menu">
    <ul>
        <li><a href="http://localhost/">1</a></li>
        <li><a href="http://localhost/">2</a></li>
        <li><a href="http://localhost/">3</a></li>
        <li><a href="http://localhost/">4</a></li><li><a href="http://localhost/">5</a></li><li><a href="http://localhost/">6</a></li>
    </ul>
    <span></span>
</div>

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

Править:

Зафиксировали его теперь путем добавления функции, которая вставляет пробел к HTML (код ниже, если кто-либо заинтересовал на данный момент или если кто-то сталкивается с этим в будущем). Кажется, что это было всем, что было необходимо! Все еще был бы интересно слышать, может ли кто-либо сказать мне, почему это необходимо.

// Add a space after the </li> in wp_page_menu to allow justification of the menu
function add_break($break) {
    return preg_replace('/<\/li>/', '</li> ', $break, -1);
}
add_filter('wp_page_menu','add_break');
6
задан Mike 11 August 2010 в 23:21
поделиться