Duvida com as unidades de medida EM e REM do CSS
Pessoal, estou estudando sobre unidades de medidas do CSS. Estou com a seguinte duvida: Para sites responsivos, a medida EM só serve para dizer o tamanho da fonte? Posso formatar uma div em forma de caixa toda com a medida EM? No caso, essa medida fica fixa? Ou responsiva? Fiz um teste e deu que ficou fixa. Mas a EM é uma medida pra sites responsivos, então o certo não era o caixa ficar de acordo com a tela do dispositivo? ou isso fica com a porcentagem (%)? Exemplo:
<!DOCTYPE html>
<html>
<head>
<title>teste</title>
<style>
div {
background-color: aqua;
width: 30.8em;
height: 30.8em;
}
</style>
</head>
<body>
<div> </div>
</body>
</html>
Aqui tenho um exemplo em que a div "pai" é em % e a div filho é com a unidade EM. Nesse caso, ele não deveria pegar o valor da porcentagem do pai, e automaticamente reduzir o tamanho da div filho? Isso parece bastante com a unidade de medida PX.
<!DOCTYPE html>
<html>
<head>
<title>teste</title>
<style>
#pai {
background-color: aqua;
width: 100%;
height: 100%;
}
#filho {
background-color: indianred;
width: 30.0em;
height: 30.0em;
}
</style>
</head>
<body>
<div id = "pai">
<div id = "filho">
</div>
</div>
</body>
</html>
No caso, pra formatação de div's com width e height, tenho que utilizar % sempre que quiser deixar responsivo ? Se sim, isso significa que em questão de formatação de imagem o EM e REM seria praticamente a mesma coisa que o pixel? sempre ficando no mesmo tamanho independente do dispositivo como no exemplo a cima?
Outra pergunta: O EM e REM é só pra tamanho de fontes ou da pra fazer a coisa a cima?
Outra pergunta: Qual a unidade de medida mais utilizada hoje em dia pra sites responsivos? EM, REM ou outra melhor?
Desde já obrigado!Discussão (4)
Carregando comentários...