Как сделать div выше на странице перед содержимым выше в потоке?

Question

Это довольно простой вопрос о дизайне, но все же: у меня есть заголовок в одном файле и несколько страниц, которые загружаются последовательно в других файлах. Я хочу добавить индикатор прогресса (только изображение заполненной полосы 1/3, 2/3 и 3/3) на каждую из этих страниц, но я хочу, чтобы панель отображалась в заголовке, который находится в другом файле и выше в поток, поэтому отрицательные поля + z-индекс не работают. Как я могу сделать свой индикатор, который логически относится к странице под заголовком, появится в заголовке?

Answer 1

как о расположении: абсолютная схема?

Answer 2

Вы, вероятно, нужно поместить индикатор в абсолютных координатах, как и в

.processBar 
{ 
    position: fixed; 
    left: 50%; 
    top: 10%; 
    z-index: 1000; 
} 

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

EDIT: cdonner правильна позиция: фиксированные позиции элемента в соответствии с окном браузера

Answer 3

Абсолютное позиционирование занимает ваш элемент из потока браузера (браузер не рассматривает этот элемент в выложив соседние элементы), чтобы вы могли позиционировать его там, где хотите.

Позиция смещения элемента абсолютного положения вычисляется относительно ближайшего родителя, который абсолютно/относительно расположен (если нет, относительно документа).

Так что, как указали другие, вы можете использовать position: absolute и позицию в терминах top и left.