Neste artigo veremos a definição de position static do CSS, como utilizá-la como também os casos em que ela é empregada da melhor forma.
Definição e como funciona a static
O valor de position static é o default de todos os elementos das páginas HTML, ou seja, sempre que criarmos um elemento novo no nosso projeto e não definirmos uma position, ela terá como valor static.
Um outro ponto importante é que a posição static não é afetada por top, left, right ou bottom
Então não é possível mover o elemento na tela com estas propriedades citadas acima
E vale também mencionar que static não é posicionado de forma especial no HTML
Ele segue o fluxo do código se encaixando onde foi colocado
Regra no CSS
Podemos posicionar um elemento com static da seguinte maneira:
.seletor { position: static; }
Porém não há necessidade pois o elemento já vem com essa posição por default
Formas de utilizar
Para ser sincero você apenas vai acabar utilizando static quando não definir uma posição para o elmento
Nos demais casos você irá preferir alguma posição que dará mais liberdade de movimento do elemento, como: relative ou absolute
Conclusão
O valor static já vem por padrão em todos os elementos HTML, então não precisamos setar esta propriedade
É bom lembrar que ele não é afetado por top, left, right e bottom
Ou seja, ele é como o nome diz: estático
Uma posição com utilização um tanto questionável, acaba apenas seguindo o flow do HTML
Então não há por que setar esta propriedade a um elemento, a não ser para sobrescrever uma regra herdade de outro
E é isso sobre static, obrigado por lerem até o fim, caso possível se inscrevam na nossa lista para receberem mais conteúdo e até o próximo!
Veja também nosso canal no YouTube!