Why is my bottom scroll bar appearing in Elements as per the screenshot 1.
It means I have to scroll across to see all the text on the righthand side.
Why is my bottom scroll bar appearing in Elements as per the screenshot 1.
Becuase you’ve designed some content that is too wide for the vieport (probably set a fixed width on something).
I first checked all component settings and could not find anything set to a fixed amount. Then I took everything off the page one by one and could not find the culprit.
I then remade the page using the same items I took off and now I have no problem.
Strange.
Thanks for the help.
Rebuilt from the start and it has all cleared up.
We think this was an issue with the Navigation Component, it should be all fixed up now.
After redoing the whole page, I said the problem of the bottom scroll bar went away. However, now the problem is back again and I have no idea how or when it arrived.
I have since discovered that changing the Spacing-Margin-left settings for the Container holding the Standard navigator, makes the problem worse.
This is down to the settings you’re using, you’d have the same problem if you hand-coded it. The nav is probably set to 100% of the page width, then you’re applying margin ontop of that, so it’s pushing things wider than the page, then you get the scrollbars…
If you post your project we can probably fix it for you, or advise on what you’re doing wrong
dan,
You said that to me last time but I could find nothing then set to 100% which is why I rebuilt the page. Here are the screenshots this time round.
That is not very helpful (sorry), we’d need to look at your project to see how things are setup. Can you share it via Elements Cloud?
Dan, here is the link to my project.
elementsapp://downloadDocument/qL15vo7HuYT3
Oh by the way, this issue might have something to do with the Desktop drop area to the right in the Standard navigator. It is over the edge by the amount I mentioned.
Cheers,
Dan C.
Did you get a chance to look at my project? I know you would be very busy but as I have indicated I am still having problems with Appearance of Bottom Scroll Bar. My last comment above might be significant.
Cheers.
Bottom Scroll Bar Problem
I have reworked my web page again from scratch without adding a Standard Navigator and, as expected, the Bottom Scroll Bar does not appear. For all this, I have been working on the md screen size and I have used a Mobile menu for this.
When I now add the Standard Navigator and work on its settings, somewhere in this working the Desktop Drop Zone overlaps to the right and causes the Scroll Bar to appear.
I have now done some more digging and found that the problem occurs when I select the lg screen size.
This can be seen in a video I took of it.
Problem goes away when I delete the Standard Navigator.
It’s becuase your menu has Margin applied to it, this adds the spacing outside of the item. Have a watch of this video and let me know if that helps clear things up a little for you.
Dan,
Thanks for getting back to me. Could you check out my previous comments. I still have a problem even when Margins are cleared. Actually I will repeat the problem here for you.
I have reworked my web page again from scratch without adding a Standard Navigator and, as expected, the Bottom Scroll Bar does not appear. For all this, I have been working on the MD screen size and I have used a Mobile menu for this.
When I now add the Standard Navigator and work on its settings, somewhere in these workings the Desktop Drop Zone overlaps to the right and causes the Scroll Bar to appear.
Having now done some more digging, I find that the problem occurs when I select the LG screen size and only the LG screen size.
This can be seen in a video I took of it, if you want it.
Problem goes away immediately I delete the Standard Navigator.
How does it look when you preview it in the browser?
Looks OK in Safari.
But this is not the only problem I am having with Standard.
Why not call it StdNav. Standard means nothing on its own. One is prompted to say Standard What!
Not very intuitive.
The Gap setting under Content Layout does nothing on my screen.
The problem I mentioned above with the selecting of the LG screen size causing the Bottom Scroll Bar to appear.
In the attached screenshot, you will notice that the Menu second from the left is Grey all the time in Safari. All other Menus work as expected in Safari. This Grey is the Active State colour.
Sorry Dan but you will hear a lot from me regarding intuitiveness.
Cheers.
Not sure if you are still having issues you have everything in a single container does this not mess up responsive layout
Is this why you needed a fixed background
Steve, if it were to mess up the responsive layout, where would I find information about how not to mess it up. This sort of information becomes critical if novice users (like me) are not to be dissuaded from using the program. If this is such a critical issue, it needs to be written in the manual.
By the way I have now removed everything out of that one container.
Cheers
Just like Elements, the Manual is a work-in-progress, we’re adding to it every week.
I’ll make sure more information and tutorials are added to help people just starting out!