- This topic has 11 replies, 5 voices, and was last updated 9 months, 1 week ago by
Leo.
-
AuthorPosts
-
July 4, 2019 at 5:10 pm #949363
Sebastien
Hi,
I have a problem into my page: when I use Desktop device, I get a horizontal scrollbar.
Can you help me to hide the scroll bar pleasE?thanks
July 4, 2019 at 5:41 pm #949379Leo
StaffCustomer SupportHi there,
This element is causing the issue:
https://www.screencast.com/t/YcYUJjU4B2iS
Not quite sure how you inserted it but if it’s with a plugin then you will need to check with the plugin author.Hope this helps π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/July 5, 2019 at 4:59 am #949680Sebastien
Hi,
I’ve desactivated this element but the issue is still there.
Any other idea?thanks
July 5, 2019 at 8:47 am #949916Leo
StaffCustomer SupportI believe this is element is causing the trouble now:
https://www.screencast.com/t/cq3JVGBGpckuIf you scroll to the right, you can actually see which element(s) is sticking out.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/July 5, 2019 at 9:27 am #949945Sebastien
Ok right that’s it, if I disable this element, the scrollbar disappears.
this problem only appears when I set “full width” into this WP gutenberg block: wp-block-media-textDo you have any idea how can I keep using Full width, but without the scrollbar?
July 5, 2019 at 10:40 am #949997Tom
Lead DeveloperLead DeveloperWhenever a block is set to full width, you need to add this CSS to your site:
body { overflow-x: hidden; }
Let me know if that does it or not π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJuly 5, 2019 at 11:34 am #950035Sebastien
You’re amazing Tom !
thanks you so muchJuly 5, 2019 at 4:57 pm #950176Tom
Lead DeveloperLead DeveloperYou’re welcome π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentAugust 28, 2019 at 8:43 am #995599Marc
Hey Tom,
I just stumbled upon this thread. Had the same problem when using a full width element for the first time.
I investigated a bit and I think this is causing it:.no-sidebar .entry-content .alignfull { max-width: 100vw; width: auto; }
max-width: 100vw;
If I understand correctly this sets the max-width to the width of the viewport and does not take the width of the scrollbar into account.Isn’t there another way to handle the width? I guess many people run into this problem, when using full width elements.
Thanks
August 28, 2019 at 11:34 pm #995995Tom
Lead DeveloperLead DeveloperUsing
alignfull
forces the element out of its container and causes this issue. Unfortunately, the only way to solve it is to use this: https://generatepress.com/forums/topic/horizontal-scroll-2/#post-949997An alternative is to set the page to full width, and then don’t use the
alignfull
classes. We have a plugin coming soon that will make this much easier πDocumentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentApril 15, 2020 at 10:08 am #1240450RafaΕ
Better solution (with JavaScript and CSS variable) figured out by Marius.
April 15, 2020 at 2:31 pm #1240736Leo
StaffCustomer SupportThanks for sharing π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.