Gostaria de ter exemplos de quando usar position para alinhar um elemento a tela, e quando usar float, vantagens e desvantagens
Gostaria de ter exemplos de quando usar position para alinhar um elemento a tela, e quando usar float, vantagens e desvantagens
Oi Lúcio, tudo bem? Bom, as duas propriedades ajudam com alinhamento, mas em geral, usa-se um ou outro de acordo com o objetivo do alinhamento. Por exemplo:
Elementos que ficam lado a lado, usa-se float, por ser mais prático e não precisar se preocupar muito com outros elementos próximos. Mas há casos que o float não resolve. Exemplo?
Imagine que você quer que um botão fique sempre do lado direito da tela, colado na borda superior interna do navegador e acompanhe o rolar da página. Position é a certeza de uso, por quê? Porque este sai totalmente do fluxo de posicionamento de elementos na página e podermos simplesmente fazer: top: 0, right: 0. Feito!
Contudo, a propriedade position, dependendo do valor que você passe para ela, requer que você também se preocupe com os elementos próximos a ele. Isso pode aumentar a complexidade. E muito.
Perceba também que com float, temos poucas opções de alinhamento (right, left) que sempre vão se relacionar a um elemento proximo deste. Já com o position, isso pode mudar, pode ser referente a outro elemento, ou não, lembrando que você ainda pode usar as propriedades top, right, bottom e left para alinhar exatamente em um ponto especifico da página.
Vantagens e Desvantagens são complicados de se avaliar neste caso, pois depende muito do uso. No sim, position é mais usado com o posicionamento do elemento foge muito o natural e pode complexo utiliza-lo enquanto float, é mais utilizado para alinhamentos pontuais, como elementos lado a lado.
Espero ter ajudado, bons estudos... Abraço
Obrigado Wanderson, ajudou sim