Output from different versions

[Bucky108]

I was experimenting with some different templates and tried the "coffee time" template from version 15.

Using the browser developer tools (F12), I compared the example on the templates page to the generated output using the template.

Of course, the output is different using different versions, but it seems like the older version handled the text (coffee makes everything better) more accurately in different responsive dimensions. See this example https://www.goldhealer.com/pics.htm

I couldn't get this to work properly in version 18. What am I missing?

[Pablo]

This has nothing to do with the version of the software.
There are two versions of the page in the templates, one with and one without breakpoints.

[Bucky108]

Yes I know. I tried it with both versions .. same result.

[crispy68]

The Coffee Time template does not have breakpoints in the template when downloaded. There is 200px gutter width in the grid which is why the text gets scrunched when it gets smaller when you preview it. However, the actual preview demo for that template has a breakpoint at which the gutter changes to 10px which is why the text looks good.

[Bucky108]

OK that does make sense but I redownloaded the template with the break point version and at the 480 breakpoint, it does in fact change the gutter width to 10 but the text box still gets squished.

[crispy68]

Which template has the breakpoint? I only saw the one.

[Bucky108]

Its the Coffee Time (coffeetime.wtp) under the Templates 2019/2020 (for WYSIWYG We page Builder 15 and newer)

[crispy68]

OK that does make sense but I redownloaded the template with the break point version and at the 480 breakpoint,

Yes, that is the same one I downloaded but there is no 480 breakpoint in the template. When I open it, there is only the default view.

Now if you are adding a 480 breakpoint and changing the gutter to 10px, you also need to change the overflow property of the grid to "hidden" so that it is responsive. Currently it is set to 'none' which means changes to gutter, etc. are not changed in breakpoints.

[Bucky108]

you also need to change the overflow property of the grid to "hidden" so that it is responsive

Yes that fixed it.
Thank you!