Perguntas do Quiz

Qual é a diferença entre um elemento com posicionamento `relative`, `fixed`, `absolute` e `static`?

Topics
CSS
Edit on GitHub

Um elemento posicionado é um elemento cuja propriedade position calculada é relative, absolute, fixed ou sticky calculada.

  • static: A posição padrão; o elemento irá fluir na página como normalmente faria. As propriedades top, right, bottom, left ez-index não se aplicam.
  • relative: A posição do elemento é ajustada em relação a si mesma, sem mudar de layout (deixando assim uma lacuna para o elemento onde ele teria sido se não tivesse sido posicionado).
  • absolute: O elemento é removido do fluxo da página e posicionado em uma posição específica em relação ao ancestral posicionado mais próximo se houver, ou em relação ao bloco inicial de contêiner. Caixas posicionadas absolutamente podem ter margens e não se sobrepõem com outras margens. Esses elementos não afetam a posição de outros elementos.
  • fixed: O elemento é removido do fluxo da página e posicionado em uma posição específica em relação à janela de visualização e não se move quando a página é rolada.
  • sticky: O posicionamento "sticky" é um híbrido de posicionamento relativo e fixo. O elemento é tratado como posicionado relative até atravessar um limite específico, momento em que é tratado como posicionado fixed.
Edit on GitHub