Правильная верстка горизонтального меню с разделителями

Часто начинающие верстальщики сталкиваются с трудностями при верстке горизонтального меню с вертикальными разделителями. Сегодня я хочу рассказать, как легко сделать кроссбраузерное горизонтальное меню с максимально чистым кодом.

Пишем HTML-код:

Теперь CSS:

Вот собственно и все. Однако хочу остановится на моменте скрытия первого разделителя. Если вы заметили, то я не использовал класс для первого элемента списка, а задал отрицательный margin влево, чтобы скрыть разделитель.

Код кроссбраузерный: IE6+, Opera 9+, Firefox 2+, Chrome, Safari

Смотрим ДЕМО