Как в меню (горизонтальный список) добавить символ "|" между пунктами ? - Вопросы по CSS

Здравствуйте.
Извините за может нубский вопрос, но я не знаю как это реализовать из-за недостатка опыта.

Сейчас вот так есть:


Нужно вот так



HTML:
<div id="mH_Line1_map">

   <jdoc:include type="modules" name="topmenu" />

</div>

CSS:
#mH_Line1_map {float: right; width: 380px; height: 12px; padding: 20px 40px 0 0; margin: 0; font: normal 12px Arial; color: #a3a3a3; text-align: right; }
   #mH_Line1_map a {font: normal 12px Arial; color: #a3a3a3; }   
   #mH_Line1_map span {font: normal 12px Arial; color: #a3a3a3; padding: 0 5px;}   
   #mH_Line1_map a:hover {font: normal 12px Arial; color: #3199c5;text-decoration: none }
   #mH_Line1_map ul { list-style: none;}
   #mH_Line1_map ul li { display:inline;}

Код который выходит в браузере :

<div id="mH_Line1_map">
<ul class="menu">
<li class="item125"><a href="/finq/index.php?option=com_content&amp;view=article&amp;id=1:welcome-to-joomla&amp;catid=29:the-cms&amp;Itemid=145"><span>About Joomla!</span></a></li>
<li class="item124"><a href="/finq/index.php?option=com_content&amp;view=article&amp;id=18:joomla-features&amp;catid=29:the-cms&amp;Itemid=145"><span>Features</span></a></li>
<li class="item123"><a href="/finq/index.php?option=com_content&amp;view=frontpage&amp;Itemid=1"><span>News</span></a></li></ul>
</div>

Как же вставить эти "палочки"?

Через настройки модуля меню.

Если не модулем а меню вшито в index.php то попробуйте так.

Код

<div id="mH_Line1_map">
<ul class="menu">
<li class="item125"><a href="/finq/index.php?option=com_content&amp;view=article&amp;id=1:welcome-to-joomla&amp;catid=29:the-cms&amp;Itemid=145"><span>About Joomla!</span></a></li> |
<li class="item124"><a href="/finq/index.php?option=com_content&amp;view=article&amp;id=18:joomla-features&amp;catid=29:the-cms&amp;Itemid=145"><span>Features</span></a></li> |
<li class="item123"><a href="/finq/index.php?option=com_content&amp;view=frontpage&amp;Itemid=1"><span>News</span></a></li></ul>
</div>

Если не модулем а меню вшито в index.php то попробуйте так.

По моему так редко бывает. Как правило, шаблон в части менею делают универсальным.

Ну мало ли. Нужно предлагать все варианты.
Не было же сказано что шаблон самописный или клубный.

Да и вклубных встречается меню вшитое.

Не вижу смысла во вшитом меню. Ток если шаблон для типовых сайтов со стандартным меню.

Через настройки модуля меню.

Уточните пожалуйста, какой пункт отвечает за это?

Ну мало ли. Нужно предлагать все варианты.
Не было же сказано что шаблон самописный или клубный.

Шаблон самописный т.к. делаю на заказ (на основе HTML+CSS+JS странички замутить и настроить Джумловский сайт)
Менюшка соответственно должна быть уникальной (настраиваемой).

Вшивать менюшку это не проблема... но это не подойдет

В админке Расширения - Модули. Выбрать модуль нужного меню и в доп параметрах задать разделитель.

В админке Расширения - Модули. Выбрать модуль нужного меню и в доп параметрах задать разделитель.

или стилями прописать в CSS border-right или border-left

хех, а у меня этот разделитель никогда не вставлялся : )

и не забыть для первого li отменить левый бордер
.menu li:first-child{border:none;}

Парни, всем огромное спасибо!
Теперь работает так как нужно.

Помоему можно через CSS написать следующее
#menu a:before {
content: '| ';
}
Где #menu ваше меню