Font size (rem) not scaling properly on certain blocks

Site URL: http://www.aromon.squarespace.com/seedling-chair

Hi there,

I have a dropdown code block on this website but for some reason the font on it doesn't scale like on the rest of the website, this is the only block I have an issue with and I have no idea if I'm totally overseeing something. On site styles my p1 is set to 1.3rem, I styled both the h3 and p tags on this block to be 1.3rem also but it's not matching at all (care and use blablabla is code block, text above is regular text block). Is this an issue with code blocks/any workarounds for this?  

Thank you! 

Hi. Can you share link to a page where you use h3? We can check its code.

As I remember correctly, SS uses not only rem, but rem + vw as well. Something like this (here is h4 size on your site, I can't find h3)

h4 {
    font-size: calc((2 - 1) * 1.2vw + 1rem);
}

Hi @tuanphan,

Ah brilliant, that makes a lot more sense. Yes sorry I don't actually use h3 on that website, just never bothered changing the code of dropdown. Changed it now though to p which is to match p1 on the website--the text block just above the code block is p1.

Thank you very much

Hi @tuanphan,

Do you know how this calculation works? I've tried searching several times and trialling different numbers but I can't get anything to match the original p1 size!

Thank you in advance! 

p1 is

Quote

font-size: calc((1.2 - 1) * 1.2vw + 1rem)