Solucionado (ver solução)
Solucionado
(ver solução)
11
respostas

Quando usar EM e REM

Pessoal,

durante todo o exercício utilizei as medidas com REM. Fiz isso por não ter muito claro como identificar o meu ponto de referência. Utilizei essa opção, por seguir o que foi falado no vídeo dessa aula (font com 20px).

Na "opinião do professor" foi utilizado o EM. Poderiam clarificar um pouco mais?

REM (root) e EM (tamanho relativo do elemento) já está claro pra mim.

11 respostas

Oi Flávio, acho que não entendi bem sua dúvida, fiquei confuso. Poderia explicar melhor?

Lendo de novo... também fiquei. hahaha

Na aula 1, o professor fala que configurou o font-size no html como 20px. E então, explicou o REM e o EM.

O que eu não estou conseguindo enxergar é onde buscar esses valores de referência, como o professor utilizou o font-size no htme, para saber os valores que eu vou utilizar. Existe uma regra?

Consegui clarificar?

Flávio já tive essa dúvida de em rem e etc, esse foi o tópico que solucionou meu problema, e me ajudou a entender a fundo como funciona tudo isso e os cálculos que são feitos. REM EM

Flávio, de fato não existe regra, o boa prática é que você use um valor que seja fácil de fazer os cálculos. Geralmente o pessoal usa números fechados como: 10px ou 20px.

Neste caso, quando utilizar 10px no HTML e eu setar um paragrafo com 1.6rem, estarei praticamente dizendo que ali naquele ponto a fonte é 16px.

Agora digamos que dentro desse paragrafo eu coloque um span e digo que ele tem 2em, eu vou considerar primeiro o tamanho do paragrafo, neste caso: 2 * 16 = 32px.

Pegou a ideia? De fato, não há regra, há boas práticas.

Uma boa prática é que: para todo elemento independente, você utilize rem, e dentro dele, em. Isso ajuda no design responsivo da página. Quando a fonte do HTML mudar de tamanho, todos os outros elementos da página se adaptam de acordo com a proporção.

Wanderson Macêdo, uma dúvida minha agora:

Agora digamos que dentro desse paragrafo eu coloque um span e digo que ele tem 2em, eu vou considerar primeiro o tamanho do paragrafo, neste caso: 2 * 16 = 32px. Uma boa prática é que: para todo elemento independente, você utilize rem, e dentro dele, em. Isso ajuda no design responsivo da página. Quando a fonte do HTML mudar de tamanho, todos os outros elementos da página se adaptam de acordo com a proporção.

Se eu colocar no parágrafo 1.6rem será 16px, e no meu span que está dentro do meu parágrafo, ao invez de colocar 2em, colocar 3.2rem, Não seria a mesma coisa?

Sim, na prática seria sim Nícolas, mas sinceramente, não vejo isso com bons olhos atualmente.

Tudo bem, obrigado por tirar essa dúvida ^^

Pessoal, obrigado pelo retorno! Ajudou muito!

Wanderson, então o melhor seria, no início da construção da página, inserir um valor para meu html?

Minha dúvida começou por causa disso. Não inseri nenhum valor inicial no html, utilizei REM em tudo e fui ajustando no olho.

solução!

Eu acho uma boa ideia sim Flávio, mas não sei dizer ao certo se isso é uma boa ou má prática. Há outras considerações, em celulares por exemplo, onde o usuário pode aumentar o tamanho da fonte padrão. Talvez seu site se adapte a isso, mas talvez não, ai você corta parte da acessibilidade do usuário. É preciso testar isso, eu não tenho certeza desse comportamento.

Entendi. Vou seguir pensando sempre em buscar qual o tamanho de fonte padrão do navegador e calcular em cima dessa informação.

Muito obrigado!

Só para servir de informativo, geralmente a fonte padrão é 16px, mas varia, no chrome até onde sei, se eu não estiver enganado, é 14 ou 15px, os demais navegadores usam valores próximos, acho que 16px é o maior valor.

Lembrando que eu não deixei certo de que fixar um valor no HTML seja ruim. É algo que precisa ser testado :)