Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] Duvida sobre o hover

Ao utilizar o hover sobre os links, ele dá uma "tremidinha"(no próprio gif de exemplo do professor acontece) na imagem quando é utilizado um tamanho de borda ou padding maior do que os botões anteriores. Como arrumar?

1 resposta
solução!

Oii, como vai? Espero que esteja bem!

Isso geralmente acontece porque o "hover" está alterando o layout da página, fazendo com que os elementos ao redor se ajustem para acomodar o novo tamanho.

Uma maneira de resolver isso é usando a propriedade "box-sizing" com o valor "border-box". Isso fará com que qualquer padding ou borda que você adicione seja incluído no tamanho total do elemento, em vez de adicionado a ele. Aqui está um exemplo de como você pode fazer isso:

div {
    box-sizing: border-box;
}

div:hover {
    border: 10px solid black;
}

Neste exemplo, quando você passa o mouse sobre a div, uma borda de 10px aparece. No entanto, devido ao "box-sizing: border-box;", o tamanho total da div (incluindo a borda) permanece o mesmo, então não há "tremida".

Espero que isso resolva o seu problema! Lembre-se, a melhor maneira de aprender é experimentando, então sinta-se à vontade para brincar com o código e ver o que acontece.

Espero ter ajudado e bons estudos!