3
respostas

Em ou Rem?

No curso "HTML5 e CSS3 II: Turbinando as suas páginas", em um exercício sobre as medidas Em e Rem, marquei uma alternativa incorreta, e ví sua correção:

(Alternativa) "O tamanho Rem possui um valor único para a página inteira, já a medida Em varia de acordo com o elemento em que é utilizada. É interessante usarmos Rem quando queremos que a mudança de tamanho se propague pela página"

(Correção) "Como Rem possui um único valor para a página inteira, é interessante usarmos essa medida justamente quando não queremos que a mudança de tamanho se propague pela página."

Aí é que eu me embabanei todo: se o Rem é uma medida só pra toda a página, e eu consigo variar dentro dela (1,5 Rem, 2.0 Rem), então se eu mudar a medida da página, no font size do HTML, tudo deveria seguir, já que é medido pelo Rem, certo? E consequentemente, se eu definir medidas específicas no Em, que representassem o valor de fonte padrão, não daria no mesmo?

(Eu tô confuso demais nessa parte, vou ficar extremamente agradecido à quem me tirar dessa vala, abraços kkk)

3 respostas

Oi Gustavo, tudo bem? Deixa eu tentar te ajudar nessa.

REM só vai mudar se o font-size do html mudar. Ela é uma medida relativa que considera apenas o font-size do html, a propagação é de nível 1, entende? Ela só vai ser alterada se o HTML mudar (apenas um nível).

EM por outro lado, considera o font-size do elemento pai imediato, ou seja, para chegar a seu valor final ele sai se baseando no elemento pai, isso pode resultar em uma variação em níveis X (o elemento pai, depois o elemento pai desse elemento, etc... até chegar no HTML).

Isso quer dizer que, quando usar em, a propagação não vai ser tãooo previsível. O font-size é uma propriedade herdada, então a mudança desse valor em um elemento pode alterar vários outros, mesmo não sendo essa mudança feita no html. Já o REM trabalha de uma forma diferente, o valor dele só se relaciona com o HTML, então a propagação é sempre previsível.

Pegou a ideia?

Então, peguei sim, mas se é pra ter mais controle elemento por elemento, então o enunciado da correção lá em cima tá meio errado, ele diz q a gente usa o Rem pra evitar que a mudança se propague pela página inteira, quando é justamente o contrário, em vez disso, usamos o Em pra controlar pequenos blocos pela página (1 elemento pai, 5 elementos filhos, todos eles se referenciando no pai, ou seja, posso controlar todos os filhos desse elemento, apenas alterando um único valor; já no Rem, teria que ir de filho em filho corrigindo os valores, pois os mesmos se baseiam no font-size da página).

Resumindo: entendi pra que serve o Em, mas acho q o enunciado da correção no exercício se confundiu um pouco (ou não?).

Obrigado ;)

Oi Gustavo, mas a ideia é essa: com REM eu tenho controle de quais elementos serão afetados pelo font-size do HTML. com EM, esse controle meio que foge, entende?

É verdade que talvez você precise ajustar cada um dos filhos que usa o REM, mas se você precisou mudar o font-size do HTML, quer dizer que a intensão era atualizar os tamanhos proporcionalmente, não?

Eu vou tentar ler novamente pra ver se parece mesmo confuso. Acho que eu é quem posso estar confundindo algo. Vou pedir pra alguém verificar comigo também.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software