Hi!
When Empty, I am experiencing columns being all pushed to the left if empty when i start on LG width and move down to MD width. Here is the video:
Thanks!
Look at left corner. In your video you got an issue. The Layout after MD and smaller not switchin’ and blue icon just dissapearing. In my case it works fine. Is your beta clean? Do you have any global custom css or js? Php version? Any plugins? Console errors?
@Georgich, yeah, I have reported that issue in the left corner in the separate thread.
This is a test site on the subdomain with few pages, but nothing much going on. It is always better to do beta in real-life situation where we are updating old content. It discovers much more errors than a clean install.
- No impactful Global Custom CSS/JS
- No Console Errors
- Tested with Plugins turned off
- PHP version: 7.2.20 (Several websites are on it, working normally)
New discovery: zooming out to 90% fixes it. Looking into it now…
Found it!
It is the Windows 10 recommended 125% scaling for high resolution devices. If it is set to 100%, then it is not usable as everything is very small. Especially in Photoshop and many other apps.
This is a serious issue actually. I don’t know if an app like Cornerstone can detect the current scaling and adjust to it. I have tried googling it and haven’t found any possible solution that would come from developer’s side. The same issue also hits Firefox.
Firefox had similar problem form day one of Cornerstone, where previews were working only at 90% with these Windows settings. Chrome was working normally. Now Firefox has double issue and Chrome started with issues.
While working at 90% does solve the preview problem, it is not the representation of the real thing, so many design problems arise.
EDIT:
It goes one step further:
90% solves the MD, but not the SM. For SM, the zoom level has to go down again, this time to 80%.
Here is the video with sound to demonstrate:
Ah… Told ya about zoom 
Where was a time then I just did not notice zoom 90% in chrome and dat’s broke completely CS Layout and preview.
Yeah. I made sure the browser zoom level is at 100%, which should ensure everything is working normally. But it turned out it was the Windows System Zoom. Can’t imagine what would happen on 4K screen which I cannot avoid in the near future since the next Generation of my laptop won’t even have less than that.
I really appreciate you doing all the troubleshooting. This makes much more sense now. I’ll investigate on windows with different settings combinations and update this thread with what I find.
Fixed for beta5! This should also correct the issue you’re seeing @Georgich when using browser zoom.
Update: beta5 is now available for download.
1 Like
Hi @alexander
I am not sure at which point has this returned, but when I hit CTRL+SHIFT+E to preview the Full width page, a three column layout renders as single column, when previewed on the Laptop size. (This is the L Size i think). All Row layouts are set to three columns, except the XS that is set to one, oh and S set to two.
Edit, this happens with any number of Columns. I have later tested with two columns.
All six columns are part of the same row.
Here is the video:
Windows 10, 120% Windows scale, 100% Chrome scale.
Hmm, the video link isn’t showing up. Here it is as preformatted text.
https://www.loom.com/share/3ad3f8030b374e18bf801b8d650ac2eb
Offtopic:
I greatly appreciate the expertise and the devotion of the whole team. I can also imagine the complexity involved into such undertaking. However, throughout the years, I have observed a steady trend of bringing back old fixed issues in newer iterations (maybe it isn’t in this particular case, but it happens often in others).
That holds the Team down and slows down development a lot. I don’t know if it is some versioning issue, or multiple team members using older code snippets that have been updated in the meanwhile, or something else. I think that this is something Themeco should seriously work to improve. 
Hi Misho,
Let me know if the next update fixes it for you (once it’s out). Here’s why this happens: If you inspect the builder in dev tools and check the iframe element, I imagine you’ll see some decimal value like 1199.X for the width. Because it’s higher than 1199 but less than 1200 we’re in a state where no media query is active at all.
The mobile picker works by forcing a max width of one of the breakpoint values on the preview iframe. For example, if you click LG it will set 1200px as the max width
While on the front end usually the browser handles this fine, there are strange cases where the iframe’s body can be slightly (fractional pixels) larger than the max-width of the iframe element itself… I fixed this before by subtracting all the max-widths by one. I did some experimenting and it looks like I need to subtract 2 from the large breakpoint. Sorry for missing that last time.
Ideally, we would want to update the stylesheets to solve it similar to how Bootstrap has by using decimal values as the upper bound of each media query. We won’t be making changes to the global styles like that however until we get closer to the theme options reboot.