px, rem, em e pt — qual usar?
px é absoluto (pixels). rem é relativo à fonte raiz (html) — ideal para layouts acessíveis que respeitam o zoom do usuário. em é relativo ao tamanho de fonte do próprio elemento (ou do pai). pt (pontos) vem da tipografia impressa: 1pt = 1/72 de polegada, e 1px ≈ 0,75pt na referência de 96 DPI.
Perguntas frequentes
Por que usar rem em vez de px?
Com rem, basta mudar o font-size do html para reescalar toda a interface, e o texto respeita as preferências de acessibilidade do navegador.
1rem é sempre 16px?
Só se a fonte raiz estiver em 16px (o padrão). Se você definir html{font-size:62.5%}, 1rem passa a valer 10px — por isso a base é configurável aqui.