Следующая опция для свойства CSS position - absolute, которая фиксирует элемент на месте относительно его родительского контейнера. В отличие от относительного позиционирования, абсолютное позиционирование удаляет элемент из обычного потока документа, поэтому окружающие элементы игнорируют его. Свойства смещения CSS (сверху или снизу, слева или справа) используются для регулировки положения.
Один нюанс с абсолютным позиционированием заключается в том, что он будет заблокирован относительно своего ближайшего предка. Если вы забыли добавить правило позиции к родительскому элементу (обычно это делается с помощью position: relative;), браузер продолжит поиск по цепочке и, в конечном итоге, по умолчанию будет использовать тег body.
Задание:
- Зафиксируйте элемент #searchbar в правом верхнем углу его родительского элемента, объявив его положение абсолютным.
- Задайте для него верхнее и правое смещения по 50 пикселей каждое.