Некоторые особенности применения свойств position, left, top, right и bottom в CSS:

• При нормальном позиционировании (если для элемента свойство position не задано или его значение static) свойства left, top, right и bottom игнорируются. 1 Элементы отображаются на странице в том порядке, как они идут в исходном коде HTML. 1
• При абсолютном позиционировании элемент не существует в потоке документа, и его положение задаётся относительно краёв браузера. 1 Ширина слоя, если она не задана явно, равна ширине контента плюс значения полей, границ и отступов. 1 Элемент с абсолютным позиционированием перемещается вместе с документом при его прокрутке. 1
• При относительном позиционировании положение элемента устанавливается относительно его исходного места. 1 Добавление свойств left, top, right и bottom изменяет позицию элемента и сдвигает его в ту или иную сторону от первоначального расположения. 1
• Свойства left и top имеют более высокий приоритет по сравнению с right и bottom. 1 Если left и right противоречат друг другу, то значение right игнорируется. 1
• Если left задать отрицательное значение, то слой уйдёт за левый край браузера, полосы прокрутки при этом не возникнет. 1 Если left задать значение больше ширины видимой области или указать right с отрицательным значением, появится горизонтальная полоса прокрутки. 1
• Если одновременно установить top и bottom, то будет применено значение top, так как оно является более приоритетным, чем bottom. 3