Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Position

tenho um elemento no final da minha pagina com as seguintes declarações associadas a ele: position: relative; top: 0; right: 0; Ele vai continuar la embaixo ou vai subir? Se continuar embaixo, porque isso ocorre?

2 respostas
solução!

Boa tarde, Renan! Tudo certo? =)

Se colocarmos essas propriedades em um elemento ele deve permanecer na mesma mesma posição, ou seja, na parte inferior!

Para entender isso, temos que lembrar da propriedade position...

Quando dizemos que queremos posicioná-lo com position: relative ele agirá de forma diferente ao position: absolute e talvez seja essa a sua dúvida... Quando colocamos de forma absoluta, podemos informar as propriedades top, bottom, left e right, e ele se posicionará com relação à tag pai...

Quando posicionamos de forma relativa, essas propriedades alterarão o posicionamento de acordo com a posição original, não de acordo com a tag pai, como a forma absoluta.

Para exemplificar, vamos considerar os seguintes códigos:

.posicao-absoluta {
    position: absolute;
    top: 10px;
    left: 10px;
}
.posicao-relativa {
    position: relative;
    top: 10px;
    left: 10px;
}

Ambos os códigos acima são bem parecidos. O primeiro caso, irá deixar o elemento a 10px do topo e da esquerda do elemento pai. Já o segundo, colocará o elemento 10px mais para baixo e para a direita com relação a posição original dele, sacou? =)

Espero ter ajudado, mas se houver dúvidas fique a vontade para postar aqui.

Abraço e bons estudos,

Fábio

Agora sim ficou mais claro, muito obrigado! :D

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software