Почему элемент с абсолютным позиционированием, позиционируется, относительно контента блока родителя?

Сабж.
Вот тут: kipov.ru/address/kirov
Правое красное меню.

Структура html:
<div class="scroller">
            <div class="scrolled">
                <ul id="category-menu">
                    ...
                </ul>
            </div><!--.scrolled-->
			<div class="scroller_bar"></div>
		</div><!--.scroller-->


CSS:
.scroller {
        position: relative;
        height: inherit;
        overflow-y: scroll;
        width: 5000px;
        overflow-x: hidden;
    }
        .scrolled {
            position: relative;
            width: 5000px;
        }
        .scroller_bar {
            position: absolute;
            height: 0px;
            top: 0;
            opacity: 0;
            -webkit-transition-duration: 0.1s;
            -moz-transition-duration: 0.1s;
            -o-transition-duration: 0.1s;
            transition-duration: 0.1s;
        }


Почему элемент scroller_bar позиционируется по высоте относительно края .scrolled, а не края .scroller в который он вложен?
Можно его как-то заставить позиционироваться относительно верхнего края .scroller?

Сейчас мне приходится добавлять позицию прокрутки чтобы компенсировать это позиционирование в top, но это портит анимацию. Или транзишен отключать приходится (((
  • Вопрос задан
  • 2380 просмотров
Пригласить эксперта
Ответы на вопрос 2
ms-dred
@ms-dred
Вечно что то не то и что то не так...
потому что у блока родителя position: relative;
Ответ написан
gluck59
@gluck59
Виртуальный глюк
Потому что у родителя выставлен relative.
Либо уберите relative, либо перенесите "ребенка" в другое место.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы