Как расположить элемент выпадающего списка под родителем?

Question

[Иван]

Суть проблемы такова: есть строчка меню, через список с горизонтальным расположением элементов, в него вложен еще список, который выпадает при наведении, но каждый подпункт меню появляется под первым, объясните, как сделать так, чтобы каждый элемент был при наведении курсора под родительским.
Пример списка:

<ul>

				<li class="menu"><a href="#">Пункт 1</a>
					<ul class="submenu">
						<li ><a href="#">Подпункт 1</a></li>
						<li ><a href="#">Подпункт 2</a></li>
						<li ><a href="#">Подпункт 3</a></li>
					</ul>
				</li>

				<li class="menu"><a href="#">Пункт 2</a>
					<ul class="submenu">
						<li ><a href="#">Подпункт 4</a></li>
						<li ><a href="#">Подпункт 5</a></li>
						<li ><a href="#">Подпункт 6</a></li>
					</ul>
				</li>
</ul>

Скрипт:

$('li.menu').hover(
		
		 function() {
      $('.submenu', this).slideDown(110);
    },
    function() {
      $('.submenu', this).slideUp(110);
    });

Answer 1

[Дмитрий]

Попробуй задать всем родительским блокам position:relative, а дочерним спискам с подпунктами задайте position:absolute и подберите координаты типа botom: 0
Я точно не уверен, но должно помочь

li.menu {
    position: relative;
}
ul.submenu {
    position: absolute;
    bottom:0;
    left:0;
}

Comments

[Иван]

Все помогло, только без bottom: 0, с ним вылетают списки наверх Спасибо!