Browser: Firefox 124 / Chrome 123 OS: Windows 11 Video:
We have created a custom breakpoint with a max-width of 600px and the name “Mobile Landscape small”. After that, we regenerated the CSS files.
If we select this breakpoint in the editor and make adjustments to elements, they are not reflected in the canvas. If we look at the page in the frontend after saving, the adjustments are applied correctly.
In the screencast, for example, a 3-column grid should become a two-column grid below 600px. In the canvas, the grid remains 3-column, even if we select the smallest breakpoint (478px) for the view. If we look at the page in the frontend, the grid is displayed in two columns as desired.
this is why I never touch default breakpoints. all builders have bugs like this comes and goes
this is clearly a bug but I have temporary solution for you.
increase your custom breakpoint that you added just +1px save it and regenerate the CSS open the page resave it too and after that remove your +1px and regenerate CSS and resave page. this will solve it. this worked for me in the past.
Hi,
Thanks so much for your report, and welcome to the forum!
This is a known problem for which we have already received a report by email. It is caused by a naming conflict (Mobile Landscape <> Mobile Landscape Small).
Interim solution: Please delete your Mobile Landscape Small breakpoint and create a new breakpoint with a completely different name - then it will probably work. Renaming the existing breakpoint won’t probably work, as it keeps its key (mobile_landscape_small).
Wow, you guys are extremely fast! Thank you very much for your input.
The advice from @sinanisler unfortunately didn’t work. However, I can understand the reasoning behind it.
Based on the hint from @timmse , I initially created a new breakpoint called ‘Custom Mobile Landscape Small’, which also didn’t work. It was only when I chose a name without ‘Mobile Landscape’ entirely that it worked.
