I'm currently working on a responsive website.
I'm having troubles when scaling on small devices, it adds an empty padding on the right of the page.
Here are the links of the 2 concerned pages:
In the Homepage, I think this is the top page slideshow which do not fit exact width.
In the contact page, I think it comes from my contact form in the lightbox when clicking the button down on the page.
I tried everything to make it ok when scaling, but none of the trick works !
Hope someone can help me to find out ?
Thank you in advance !
I am viewing your site on an iPhone and I don't see any issues. Can you provide us with more info on how we could reproduce your issue?
If you did something that resolved your issue, can you post the solution here for the benefit of other users?
The issues are still visible on my iphone and also when I inspect the page on browser.
Simply swip to the right of the page and you'll see that all "full width" elements are smaller than the total width.
There is a "blank" part on the right.
Can you see it ?
This is a typical issue, if you have elements overlapping/positioned outside the breakpoint/page width.
Please try this:
Mobile browsers always try to display all elements of your page. Misplaced elements therefore often cause a zoomed in or shifted view.
If you don’t find an issue, test-wise delete all 3rd party widgets.
If your issue persists, reduce your site to only one typical page, only the affected breakpoints and try to delete as many elements as possible. Save this .muse file under a new name and let us have a look at it (–> Dropbox, Creative Cloud).
You may follow these instructions: https://forums.adobe.com/docs/DOC-8652
I don't have any elements overlapping the breakpoints, I really don't understand why I have this issues.. everything is set up to stay inside the breakpoints
Here is the .muse file with the only breakpoint concerned (600px), if you can have a look at it: moneytimeTest.muse - Google Drive https://drive.google.com/a/rebatet.fr/file/d/0B2xXKeFG_VblbEl5akRxUWdYcUk/view?usp=sharing
Thank you !
There´s something that needs some alignment, I guess.
„… I don‘t have any elements overlapping the breakpoints.“
But to be honest, this overlapping element is "only" the lightbox element. This should normally not be a problem, should it?
But anyway, if I center the composition, this horizontal scrollbar disappears.
The lightbox elements are not the culprit. I misinterpreted the screenshot.
Here the solutions:
• Horizontally shifting on „Homepage": Please unpin the „Prev“/„Next“ buttons and all works correctly.
• Horizontally shifting on „Contact“: Please unpin the „Formulaire de Contact“ button, and all works correctly.
In the new versions of Muse, pinning behaviour has been modified. In most cases, pinning isn’t necessary at all in the newest Muse version.
Especially, if you are dealing with fixed width elements (like the 3 buttons mentioned above) on fluid pages, pinning may cause unexpected effects. Therefore first of all leave these elements unpinned.
Oh, I understand now.
Thank you for this information, I won't pin elements inside a composition ever again !
Homepage works correctly now Except the previous & next buttons which are not properly positionned anymore.
Same thing for the "formulaire de contact" button, If I unpin it, it is not centered anymore inside the page
Do you have any trick to center them without pinning ?
Thank you very much to all of you for your help !
My apologies. In fact, I saw it, but as it starts at 350px, I guess the issue should start at 350px, but between 550px and 350px it is also affected..
I’d wait, until the next public release of Muse will be available. I think, it is not that much time any more.
Usually at Adobe MAX new CC apps are introduced. And Adobe Max is next week wednesday .
Can't wait !
Meantime, I found a trick for my button to be centered:
I made it full width and I only pinned the button inside the container.
It's going to work until the next release !