Hi. I have set the Dawn theme’s page width to 1200px (theme settings > layout > page width), and the sections are 1200px wide.
If I increase the font size scale (theme settings > typography > body > font size scale) above 100%, say 120% the font size increases, but then the sections increase in width. In this example, they increase to 1320px.
What’s the reason for that?
I guess your sections had padding left and right is 60px.
Hello @fencetalk ,
The reason for this is due to the way that CSS calculates element sizes. When you increase the font size, the text within the section takes up more space, which causes the overall size of the section to increase as well.
In Shopify’s Dawn theme, the section width is set to 1200px by default. However, this width is not fixed, and it can change based on the content within the section. When you increase the font size scale, the text within the section becomes larger, which means that it takes up more horizontal space. As a result, the section width also increases to accommodate the larger text.
If you want to maintain a consistent section width, you may need to adjust other settings such as margins, padding, and line-height to compensate for the larger font size. Alternatively, you can use CSS media queries to adjust the section width at different screen sizes, so that it remains consistent regardless of the font size scale.
Let us know if you need any further support.
Ali Reviews team.