Верстка меню

[sympler]

есть меню, элементы расположены горизонтально

<ul id="topmenu">
  <li><a href="#">Главная</a></li>
  <li><a href="#">Новости</a></li>
  <li><a href="#">Блог</a></li>
  <li><a href="#">Акции</a></li>
  <li><a href="#">Контакты</a></li>
</ul>

Никак не могу написать css код чтобы меню было на всю ширину (допустим 100% при резиновой верстке) и расстояние между элементами было одинаковое.

http://jsfiddle.net/4V3eq/ - тут элементы к левому краю прижимаются, а надо чтобы первый к левому краю, последний к правому краю, а остальные элементы между ними распределены равномерно

Edited January 19, 2012 by sympler

[buddah]

#topmenu {
    display: table;
    width: 100%;
    outline:1px solid red;
    table-layout: fixed;
}
#topmenu li {
    display: table-cell;
}

Поработай еще с правым краем

Edited January 19, 2012 by buddah

[sympler]

решил

#topmenu {
    display: table;
    width: 100%;

    table-layout: fixed;
}
#topmenu li {
    display: table-cell;
    text-align: center;

}

table-layout в принципе необязательно.

[SelenIT]

Как вариант, можно посмотреть в эту сторону.