Oi Andréia!
Vou tentar responder suas perguntas da forma como eu entendi.
1 - Mas agora me confundi, se eu usar o "rem", não estaria deixando a página responsiva e assim em qualquer browser funcionaria porque devo colocar um valor na tag html então se o default já é 16px?
Você pode definir o valor na tag <html> pra forçar todos os navegadores a exibir sua página com o mesmo tamanho, independentemente da fonte configurada, seja padrão ou configurada pelo usuário.
Por exemplo, digamos que você não incluiu o font-size na <html>.
Se um usuário configurar o navegador para usar uma fonte de 30px, ele vai ver na tela um resultado diferente de quem deixar o valor padrão (16px, normalmente).
Mas se você definir font-size: 20px;, por exemplo, todos vão ver a mesma coisa, independentemente da configuração do navegador.
2 - Se eu usar "em" terei que colocar um valor em pixel no elemento pai de qualquer jeito não é isso?
Não. Se você usar em o elemento vai buscar o valor no elemento pai, mesmo que você não tenha definido nenhum valor em pixels.
Considere, por exemplo, o código (disponível aqui: http://codepen.io/israelss/pen/akrPpw):
<div class="pai">
Texto pai - font-size: 10px;
<div class="filho">
Texto filho - font-size: 15px;
<div class="neto">
Texto neto - font-size: 30px;
</div>
</div>
</div>
com o CSS:
.pai {
font-size: 10px;
}
.filho {
font-size: 1.5em;
}
.neto {
font-size: 2em;
}
Veja que não defini um font-size em pixels na classe "filho", mas mesmo assim o elemento da classe "neto" reconheceu o valor correto do tamanho da fonte.
Espero ter ajudado.
Abraços!
