Component displaying differently across pages

Community resources General
1

Hi there,

I’ve created a component to display 3 of my 9 case studies which you can see on my homepage at [https://www.selfemployedmortgagehub.com]

When I copy the component (called 3 case studies) over to this page:

the type is a larger size which I don’t want.

I suspect this is to do with how my fonts are interacting with the global settings for that page but I don’t know enough about web design to work out how to fix it.

If anyone can suggest how to fix this I’d be very grateful.
Share link below.

Many thanks.

2

Hi there,

To ensure consistent text sizing across your pages, it’s recommended to use rem (root em) units instead of pixels (px). Rem units scale relative to the root font size, making your text more responsive and maintaining consistency throughout your project.

Here’s why rem units are better:

  • They scale proportionally with user preferences
  • They maintain consistent relationships between different text elements
  • They’re more accessible and responsive across different devices

You can check how your text appears at different sizes using the Text zoom preview tool in Canvas settings. Also, review your Body (All pages) tag settings, as these define the base styles that other elements inherit.

For more information about rem units, you can check out our documentation here: https://help.webflow.com/hc/en-us/articles/33961334261779#rems-(root-ems)

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

3

Thank you. I’ll check this out and implement.