Scaling issue in the design/preview vs published

Design help General
1

Hi all,

There is a scaling issue in the designer panel that I’m experiencing lately.
It’s difficult to design accurately when what you see is not what you get.

The sizes of elements/text I am visually seeing in the design panel and in preview are completely different from what I see in the published site. Meaning: 16px in designer is visually smaller looking than 16px in the published site.

Here is how it looks in designer:

Designer view
Designer view1252×712 45.8 KB

Here is how it looks in the published site:

Published view
Published view1252×712 61.1 KB

Both screenshots are taken with the same dimensions (1250px X 710px)

Have someone experienced the same issue?
Can you please open both links and check if they visually look the same?
Any idea how to fix this?

Here is the site Read-Only: https://preview.webflow.com/preview/ecommerce-cart-banner?utm_medium=preview_link&utm_source=dashboard&utm_content=ecommerce-cart-banner&preview=92b7769d31007a86f1e95a7987d9350f&workflow=preview

Here is the published site: https://ecommerce-cart-banner.webflow.io/

2

Hi Eli,

Looks the same on my side

Try using EMs, %, and REMs, so you can play with the sizing by changing the font size on different breakpoints

3

That’s strange. I tried EMs and %. Nothing worked.

I can’t figure this one out.
:thinking: