Gostaria de ter exemplos de quando usar position para alinhar um elemento a tela, e quando usar float, vantagens e desvantagens
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
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