Нужна помощь по меню категорий

[angry_ded_mazay]

Уважаемые форумчане, очень нужна Ваша помощь!

Третий день бьюсь над задачей, поэтому голова уже просто не варит.

Делаю меню категорий товара. Порывшись в темах на форуме, сделал меню горизонтальным и выпадающим, но... никак не получается сделать так, чтобы горизонтально выводился только первый уровень, а все подкатегории (а их еще два уровня), располагались вертикально. Понимаю, что все должно решаться стилями float:left; и float:none;. Но горизонтального расположения элементов удается добиться только прописав стиль в самом файле шаблона:

 

        <!-- Меню каталога -->

{* Рекурсивная функция вывода дерева категорий *}

<div id="catalog_menu">

 

{function name=categories_tree}

{if $categories}

<ul>

{foreach $categories as $c}

{if $c->visible}

<div onmouseover="sub_menu({$c->id}, 0);" onmouseout="sub_menu({$c->id}, 1);" style="float: left;">

<li class="{if $category->id == $c->id}selected{/if}">

<a href="catalog/{$c->url}" data-category="{$c->id}">{$c->name}</a>

</li>

{if in_array($category->id, $c->children)}

<div>

{categories_tree categories=$c->subcategories}

</div>

{else}

<div style="display:none;" id="submenu{$c->id}" onmouseover="sub_menu({$c->id}, 0);" onmouseout="sub_menu({$c->id}, 1);">

{categories_tree categories=$c->subcategories}

</div>

{/if}

</div>

{/if}

{/foreach}

</ul>

{/if}

{/function}

{categories_tree categories=$categories}

</div>

<!-- Меню каталога (The End)-->    

 

Подключение класса с нужными стилями, почему-то никакого эффекта не производит...

[Kpoxa]

пример реализации приведите

[angry_ded_mazay]

пример реализации приведите

как здесь http://depol.com.ua/

[RodgerFox]

Еще раз напишите, что не так, не доходит) 12 часовой рабочий день весь рассудок испортил.

[filth]

#catalog_menu li {
float: left;
position: relative;
}
#catalog_menu ul ul {
position: absolute;
}
#catalog_menu ul ul ul {
position: absolute;
top: 0px;
left: 100%;
}

 

Ну еще что то от скрипта зависеть может.

[angry_ded_mazay]

 

#catalog_menu li {
float: left;
position: relative;
}
#catalog_menu ul ul {
position: absolute;
}
#catalog_menu ul ul ul {
position: absolute;
top: 0px;
left: 100%;
}

 

Ну еще что то от скрипта зависеть может.

Почти оно.. Но вложенные пункты упрямо появляются только в одном положении. Как будто привязка идет не к родительскому элементу, а к краю браузера(

[angry_ded_mazay]

Еще раз напишите, что не так, не доходит) 12 часовой рабочий день весь рассудок испортил.

Ой! Даже беспокоить неудобно после долгого рабочего дня))

[angry_ded_mazay]

На сегодняшний день имею следующее:

- пункты подменю появляются не под родительским элементом, а в строго определенной позиции экрана (попытки поменять значение position приводят к тому, что съезжает вся верстка меню)

- при заходе на страницу вложенной категории, выпадающее меню остается раскрытым и не прячется.

Моих познаний в CSS определенно не хватает, чтобы решить эти вопросы самостоятельно

[angry_ded_mazay]

Большое спасибо всем, кто отозвался. Проблема решена...