CSS Box Model
. Элементы уровня блока автоматически начинаются с новой строки (считайте заголовки, абзацы и div), в то время как встроенные элементы располагаются внутри окружающего содержимого (например, изображения или промежутки). Стандартная компоновка элементов таким образом называется normal flow
документа, но CSS предлагает свойство position, чтобы переопределить его. Когда позиция элемента установлена на relative
, она позволяет указать, как CSS должен перемещать ее относительно текущей позиции в обычном потоке страницы. Он соединяется со свойствами смещения CSS left
или right
, а top
или bottom
. Они говорят , сколько пикселей, проценты, или Эмс , чтобы переместить элемент от места , где она обычно располагается. В следующем примере перемещение абзаца 10 пикселей снизу: п {Изменение положения элемента относительно относительного не удаляет его из обычного потока - другие элементы вокруг него все еще ведут себя так, как если бы этот элемент находился в позиции по умолчанию. Заметка
позиция: относительная;
снизу: 10 пикселей;
}
position
h2
на relative
и используйте смещение CSS, чтобы переместить его на 15 пикселей от top
где он находится в нормальном потоке. Обратите внимание, что нет никакого влияния на позиции окружающих элементов h1 и p. h2
должен иметь свойство position
заданное relative
.
testString: 'assert($("h2").css("position") == "relative", "The h2
element should have a position
property set to relative
.");'
- text: Ваш код должен использовать смещение CSS для относительно позиционирования h2
15px от top
где он обычно сидит.
testString: 'assert($("h2").css("top") == "15px", "Your code should use a CSS offset to relatively position the h2
15px away from the top
of where it normally sits.");'
```
I still think the h2 is where it normally sits.
```