Pro 4.1.5 - custom css not showing properly in the previews

If I use media queries to override CSS settings then the overrides don’t display in the builder previews.

If I set all the mobile settings in the builder and use min-width in my media queries then I still see the mobile settings.

If I set all the desktop sizes and then use max-width in my media queries I have the some problem when viewing the mobile break points.

Can you let me know a specific code example I can try? I’ve tried this out and with custom css and element CSS it’s working here. Maybe I’ll figure it out if I see the exact problem. Thanks!

Cool. It’s 8pm here and I’m just transferring a site to another domain so we can test some issues.

As soon as that is done I’ll have look. May only be tomorrow but maybe just give you some credentials.

So one thing is that I am using clamp to set a font size. In the builder it is rendering the smallest size but on the front-end it renders correctly. It’s a bit odd because there are several sections and all of them except one render the font at the smallest size irrespective of the break point in the builder preview. The one that doesn’t render small stays big the entire time :frowning: It’s also fine on the front-end.

.x-text.headline-hero .x-text-content-text-subheadline {
font-size: clamp(3.25rem, 3.5vw + 2rem, 6.25rem);
}

There was some other stuff but it has been a while and I can’t remember where the issues were. Maybe a different site???

I’m sorry for the delay here. So I just tried that exact code and it’s identical on the front and and in the builder for me. It must be a combination of things going on. Let me know if there’s a page I can login and check. Thanks!

I’ll look and see. I have the element set for the smallest size in the builder and I also have a media query for the biggest size in my CSS. Then I’m using clamp which should override the smaller font setting but in the builder preview I just see the size I set in the element.

The theory being that at least for devices that don’t support clamp people have a reasonable experience on both mobile and desktop.

Anyway I’ll double check everything and if I have not luck I’ll provide a login.

Gotcha, makes sense. Pretty cool technique. I’m mostly concerned about anytime the live preview in the builder isn’t identical to the front end. We definitely want that to be consistent. Usually I can discern why if I can reproduce or see it so just let me know. Thanks!