Фиксированная позиция, но относительно контейнера - PullRequest
Новая
       105

Фиксированная позиция, но относительно контейнера

567 голосов
/ 22 июля 2011

Я пытаюсь исправить div, чтобы он всегда прилипал к верхней части экрана, используя: 

position: fixed;
top: 0px;
right: 0px;

Однако div находится внутри центрированного контейнера. Когда я использую position:fixed, он фиксирует div относительно окна браузера, например, напротив правой стороны браузера. Вместо этого он должен быть зафиксирован относительно контейнера.

Я знаю, что position:absolute можно использовать для исправления элемента относительно div, но когда вы прокручиваете страницу вниз, элемент исчезает и не прилипает к вершине, как с position:fixed.

Есть ли хак или обходной путь для достижения этой цели?

Ответы [ 21 ]

0 голосов
/ 11 апреля 2012

Проверьте это: 

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
    </head>
    <body style="width: 1000px !important;margin-left: auto;margin-right: auto">
        <div style="width: 100px; height: 100px; background-color: #ccc; position:fixed;">
        </div>
        <div id="1" style="width: 100%; height: 600px; background-color: #800000">
        </div>
        <div id="2" style="width: 100%; height: 600px; background-color: #100000">
        </div>
        <div id="3" style="width: 100%; height: 600px; background-color: #400000">
        </div>
    </body>
</html>
Страница:
...