Проблема с созданием субменю
 

Есть стандартная задача: при наведении на пункт меню категорий показывать список подкатегорий.

<ul class="tree_main_categorys">
   ...
   <li class="sidebar_submenu">
      <a href="#" class="submenu_main_link">BlaBla</a>   
      <ul class="submenu_list">      
         <li><a href="#">Antiques</a></li>      
         <li><a href="#">Art</a></li>
         ...
      </ul>
   </li>
</ul>

Когда наводим на li.sidebar_submenu, должен показываться список ul.submenu_list. Но, к сожалению, li.sidebar_submenu ведет себя почему-то как блок со свойством overflow:hidden, то есть показывается только тот кусок списка, который помещается в этот li. Установка значения overflow:visible не помогает (сайту уже несколько лет и он имеет достаточно крупную таблицу стилей, установка в этом свойстве !important так же не дало результата). ul.submenu_list, естественно, position:absolute.

Что это может быть и как с этим бороться?
Заранее спасибо.

фаербаг вам в руки

Это если не ошибаюсь из за position:absolute. Присвойте элементу li.sidebar_submenu свойство position:relative

По твоему огрызку не понятно что там у тебя и почему... Сделай полный тестовый пример - тогда и будет ясно.

Пользуюсь инструментами разработчика в хроме, там всё так, как я прописываю в css.Я сразу так сделал, не первый раз подобный функционал реализовываю, всегда всё было ок.По-моему всё прозрачно. Наводим на блок со стилями

parent {position:relative; overflow:visible; height:100px; width:100px;},

появляется дочерний элемент

parent child {position:absolute; z-index:100; width:1000px; height:1000px;}

Ширина и высота для тестирования, в реальности они auto для обоих
Появляется только кусок child, который помещается в 100px*100px родительского элемента.

<style type = "text/css">
ul{
	width: 100px;
	border: 1px solid red;
}
.with_sub{
	position:relative;
}
.with_sub ul{
	display: none;
	position: absolute;
	top:0px;
	left: 100%;
}
.with_sub:hover > ul{
	display: block;
}
</style>

<ul>
	<li>item 1</li>
	<li class = "with_sub"><div>item 2 (sub)</div>
		<ul>
			<li>sub 1</li>
			<li class = "with_sub"><div>sub 2(sub sub)</div>
				<ul>
					<li>sub sub 1</li>
					<li>sub sub 2</li>
					<li>sub sub 3</li>
					<li>sub sub 4</li>
				</ul>
			</li>
			<li>sub 3</li>
		</ul>
	</li>
	<li>item 3</li>
</ul>

так?

С overflow: auto; все работает как надо (если правильно понял)

<style>
.first {
	position:relative; overflow:auto; height:100px; width:100px;
}

.second {
	position:absolute; width:400px; height:400px;background-color: red;z-index: 100;
}
</style>
<div class="first">
	<div class="second"></div>
</div>

Отбой, господа. Только въехал что предыдущий разработчик, по непонятным причинам, одному из блоков (там вложенность элементов большая) присвоил overflow:hidden.
Всем спасибо за помощь и извините за ложную тревогу.

что за проблема с position: absolute?

У элемента с position:absolute свойства top, left, bottom, right будут срабатывать относительно первого встретившегося элемента с position:relative в цепочке родителей. Но проблемы я в этом не вижу.