These sizes display correctly when my browser window is set above 1620px wide, but when I size the window smaller than that, the font sizes get much BIGGER, which seems counter-intuitive, and not at all how I want them to appear. I want them to be the same.
UPDATE: After lots of trial & error, and not wanting to do this as a custom CSS fix, I adjusted my base font size to 18px instead of 14px in the Site Styles, and then adjusted all the font styles to a smaller rem size, and the built-in scaling was not as extreme. It's still there in the breakpoint between 1619 and 1620, but not as noticeable now -- the calculation formula for whatever reason is not great.
I wanted to follow this thread because I'm experiencing a similar issue. My Heading 1 font scales down when the window is scaled up. I checked my coding to see if there was anything causing this but I think it's a 7.1 issue. Hoping there can be a ccs solution to this!
But man it's crazy that this formula is wrong. What a nightmare to have to write custom code for every instance this occurs.
It pains me to think of all the websites that behave incorrectly because of this.
How can we report this as a bug to Squarespace?
THANK YOU this worked for me. Was going crazy trying to figure out a workaround, this really shouldn't be an issue years later. Figured the 'text scaling' option would be the answer but it's pretty useless.
Hi all. I'm a CSS newbie, but am starting to get the hang of it. Have made a few customizations that have worked thus far to both the standard and mobile site. I don't know if any of those customizations are overriding what I'm trying to do with the mobile menu font size, which is too big and I just want to bring it down a notch.
Hi!
I am also trying to change the sizing of my menu in the mobile version, but the coding here doesn't work for me. How do I do?
Site's URL:
spinach-sprout-hgc2.squarespace.com
(OR www.medvetenkultur.org if the domain connection has been made. In that case the password would be medvetenkultur)
Scaling rules are applied when determining the computed value of the font-size property for math elements relative to the font-size of the containing parent. See the math-depth property for more information.
Keywords are a good way to set the size of fonts on the web. By setting a keyword font size on the element, you can set relative font-sizing everywhere else on the page, giving you the ability to easily scale the font up or down on the entire page accordingly.
Setting the font size in pixel values (px) is a good choice when you need pixel accuracy. A px value is static. This is an OS-independent and cross-browser way of literally telling the browsers to render the letters at exactly the number of pixels in height that you specified. The results may vary slightly across browsers, as they may use different algorithms to achieve a similar effect.
Font sizing settings can also be used in combination. For example, if a parent element is set to 16px and its child element is set to larger, the child element displays larger than the parent element on the page.
Note: Defining font sizes in px is not accessible, because the user cannot change the font size in some browsers. For example, users with limited vision may wish to set the font size much larger than the size chosen by a web designer. Avoid using them for font sizes if you wish to create an inclusive design.
Using an em value creates a dynamic or computed font size (historically the em unit was derived from the width of a capital "M" in a given typeface.). The numeric value acts as a multiplier of the font-size property of the element on which it is used. Consider this example:
If a font-size has not been set on any of the 's ancestors, then 1em will equal the default browser font-size, which is usually 16px. So, by default 1em is equivalent to 16px, and 2em is equivalent to 32px. If you were to set a font-size of 20px on the element say, then 1em on the elements would instead be equivalent to 20px, and 2em would be equivalent to 40px.
Assuming that the browser's default font-size is 16px, the words "outer" would be rendered at 25.6px, but the word "inner" would be rendered at 40.96px. This is because the inner 's font-size is 1.6em which is relative to its parent's font-size, which is in turn relative to its parent's font-size. This is often called compounding.
rem values were invented in order to sidestep the compounding problem. rem values are relative to the root html element, not the parent element. In other words, it lets you specify a font size in a relative fashion without being affected by the size of the parent, thereby eliminating compounding.
Like the em unit, an element's font-size set using the ex unit is computed or dynamic. It behaves in exactly the same way, except that when setting the font-size property using ex units, the font-size equals the x-height of the first available font used on the page. The number value multiplies the element's inherited font-size and the font-size compounds relatively.
\n Scaling rules are applied when determining the computed value of the font-size property for math elements relative to the font-size of the containing parent.\n See the math-depth property for more information.\n
Using an em value creates a dynamic or computed font size (historically the em unit was derived from the width of a capital \"M\" in a given typeface.). The numeric value acts as a multiplier of the font-size property of the element on which it is used. Consider this example:
Assuming that the browser's default font-size is 16px, the words \"outer\" would be rendered at 25.6px, but the word \"inner\" would be rendered at 40.96px. This is because the inner 's font-size is 1.6em which is relative to its parent's font-size, which is in turn relative to its parent's font-size. This is often called compounding.
I find that the default font size in notes of 16pt is too large and I often want to set the default smaller. What's more when in a note and manually selecting a different font size as soon as you move to a new line the font size returns back to 16pt, infuriating.
Evernote, please add this feature. I am getting fed up with the laborious manual font size changing that I have to do to keep my notes looking as I wish. Internet searches will find many others with this same frustration.
c01484d022