--- id: 587d781e367417b2b2512acc title: Lock an Element to the Browser Window with Fixed Positioning challengeType: 0 videoUrl: https://scrimba.com/c/c2MDNUR forumTopicId: 301061 localeTitle: Блокировка элемента в окне браузера с фиксированным позиционированием --- ## Description
Следующая схема компоновки, которую предлагает CSS, - это fixed позиция, которая является типом абсолютного позиционирования, который блокирует элемент относительно окна браузера. Подобно абсолютному позиционированию, он используется со свойствами смещения CSS, а также удаляет элемент из обычного потока документа. Другие предметы больше не «реализуют», где они позиционируются, что может потребовать некоторых корректировок компоновки в другом месте. Одно ключевое различие между fixed и absolute позициями состоит в том, что элемент с фиксированной позицией не будет перемещаться, когда пользователь прокручивается.
## Instructions
Навигационная панель в коде помечена идентификатором navbar . Измените его position на fixed и смещайте его на 0 пикселей top и на 0 пикселей left . Обратите внимание на (отсутствие) воздействия на позицию h1 , оно не было сдвинуто вниз, чтобы разместить панель навигации, и ее необходимо будет отрегулировать отдельно.
## Tests
```yml tests: - text: The #navbar element should have a position set to fixed. testString: assert($('#navbar').css('position') == 'fixed'); - text: Your code should use the top CSS offset of 0 pixels on the #navbar element. testString: assert($('#navbar').css('top') == '0px'); - text: Your code should use the left CSS offset of 0 pixels on the #navbar element. testString: assert($('#navbar').css('left') == '0px'); ```
## Challenge Seed
```html

Welcome!

I shift up when the #navbar is fixed to the browser window.

```
## Solution
```html

Welcome!

I shift up when the #navbar is fixed to the browser window.

```