Por que a medida relativa não foi utilizada no padding, margin e gap, que estão recebendo um valor absoluto? No caso tratado, somente trocamos o font-size!
1
resposta
resposta
REM
Olá Pedro, tudo bom?
Segundo percebi foi mais por conta do planejamento da aula/projecto.
Pois é possível definir o rem/em em outros elementos filhos do html também. É uma técnica muito utilizada quando trabalhamos com responsividade, pois alterando somente o valor padrão do elemento pai os valores em rem dos elementos filhos são automaticamente recalculados segundo o valor atualizado do elemento pai.
Portanto, você pode encarar o seguinte cenário:
- Desktop: Tamanho base da font-size: 16px = 1rem
div { height: 2rem; width: 2rem;} isso significa que a div terá um tamanho em pixel igual a 32px por 32px
- Mobile: Tamanho base da font atualizado para 10px
No Mobile a div com as mesmas medidas em rem div { height: 2rem; width: 2rem;} terá seu tamanho atualizado para 20px por 20px.
Pois agora o 1rem é igual a 10px.
Fonte: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_and_units