O designer com quem trabalho sabe o tamanho das fontes em px. Eu quero renderizá-los como% para que eu possa ajustar o tamanho da fonte no elemento do corpo, se necessário, para dimensionar o tamanho da fonte da página inteira.
Veja como fazer isso usando meu pré-processador CSS favorito, Stylus.
Crie uma base que é usada no corpo e, em seguida, use a font-size-scaledfunção simples sempre que quiser especificar um tamanho de fonte em px que será renderizado como%.
basefont = 14px
font-size-scaled(size)
font-size round((size/basefont)% * 100, 3);
body
font-size basefont
h1
font-size-scaled 28px // 200%