Locked elements drifting

Hey guys,

I’m building a very simple website. I have duplicate artwork and menus across multiple pages that are locked to a position. In the app i can see that they are locked to the chosen positions. But when I preview they drift across the various pages. A few pages will be locked in the correct place, others will be 10 or so pixels out. Is this a bug, or am I missing something?

Thanks guys!

Hi @editor1593, locking only affects the canvas and editing. It has no effect on the output website.

There isn’t much context to your question so I don’t know if it’s preview or the published site, whether you have added multiple devices or if you have changed the setting to only preview the current device.

The only thing that comes to mind is that you have added all devices and then only edited one. Sparkle does give you a warning icon on the devices toolbar button in some cases, but you need to review the layout of devices you are not editing. The shortcut to this, outlined in the devices documentation, is to first complete your desktop layout, then add only the 320 layout, then add all other devices letting sparkle auto scale them.

Sparkle generally has near pixel perfect layout, text and other things can occasionally throw it off a little, but normally it’s ok.

Thanks for your reply.

To try and clarify, I’m only working on one device at the moment, once i get the layout right I’ll move onto how the site will work for other devices. So I’m just using the PCs layout at the moment. I have a header graphic, the name of the company. When I check its position in sparkle across pages it locked in the same position across all pages. When I click preview to view the website in safari the graphic drifts on different pages.

I can publish a work in progress if that helps?

Thanks!

Would be more useful if you could send us the project file so we can take a look: feedback@sparkleapp.com

For everybody’s benefit, the issue was a slight horizontal offset of some pages. I should have thought about it, the problem is the scrollbar showing on some pages and not on others, depending on the length of the content.

This issue doesn’t show up on Macs where the primary mouse is a touch device, so built in trackpad or Magic Mouse. The scrollbars are hidden automatically there, so the available space in the browser is always the same. On Macs with a wheel mouse, scrollbars are visible. Or, there’s a setting in the general system preferences, to control scrollbar visibility.

Anyway the solution is an option in the miscellaneous site settings to force scrollbar visibility, this way all pages will have the same horizontal position regardless of the kind of scrollbar.

1 Like