положення: відносне; змінює положення елемента відносно батьківського елемента та відносно самого себе, а також те місце, де він зазвичай знаходитиметься в звичайному документообігу сторінки. Це означає, що він відносно свого початкового положення в батьківському елементі. 1 вересня 2021 р
Елемент із позицією: relative; є розташоване відносно його нормального положення. Встановлення властивостей верхнього, правого, нижнього та лівого відносно розташованого елемента призведе до його відхилення від нормального положення. Інший вміст не буде скориговано відповідно до проміжків, залишених елементом.
Що сталося коли ми хочемо перемістити GreenBox, але не хочемо впливати на макет навколо нього? Тут на допомогу приходить відносна позиція. Перемістіть зелену рамку відносно її поточної позиції на 20 пікселів зліва та зверху, не змінюючи макет навколо неї.
Яке визначення відносного положення? Положення об’єкта відносно іншого об’єкта, а не щодо абсолютного положення. Наприклад, положення підводного апарату відносно надводного судна.
Зазвичай ви лише позиціонуєте щось абсолютно якщо ви не можете використати будь-який інший метод позиціонування, щоб змусити макет працювати. Прикладом може бути розміщення значків або елементів усередині контейнера.
Використовується відносне позиціонування в CSS коли потрібно налаштувати положення елемента, не впливаючи на компонування інших елементів. Він також використовується, коли ви хочете створити контекст для абсолютно позиціонованих дочірніх елементів.