CSS Box Model
do CSS Box Model
. Os itens no nível do bloco iniciam automaticamente em uma nova linha (pense em cabeçalhos, parágrafos e divs) enquanto os itens sequenciais ficam no conteúdo ao redor (como imagens ou vãos). O layout padrão dos elementos dessa maneira é chamado de normal flow
de um documento, mas o CSS oferece a propriedade position para substituí-lo. Quando a posição de um elemento é definida como relative
, ele permite especificar como o CSS deve movê-lo em relação à sua posição atual no fluxo normal da página. Ele é emparelhado com as propriedades de deslocamento de CSS da left
ou right
e top
ou bottom
. Eles dizem quantos pixels, porcentagens ou ems para mover o item para longe de onde ele está normalmente posicionado. O exemplo a seguir move o parágrafo a 10 pixels da parte inferior: p {Alterar a posição de um elemento para relativo não o remove do fluxo normal - outros elementos em torno dele ainda se comportam como se esse item estivesse em sua posição padrão. Nota
posição: relativa;
fundo: 10px;
}
position
do h2
para relative
e use um deslocamento de CSS para afastá-lo 15 pixels da parte top
de onde ele se encontra no fluxo normal. Observe que não há impacto nas posições dos elementos h1 e p circundantes. h2
deve ter uma propriedade de position
definida como relative
.
testString: 'assert($("h2").css("position") == "relative", "The h2
element should have a position
property set to relative
.");'
- text: Seu código deve usar um deslocamento CSS para posicionar o h2
15px de forma relativamente longe do top
de onde ele normalmente fica.
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.
```