So I've noticed that the responsive mobile version of the theme has some horizontal movement. For example, when you're scrolling on an iPhone, sometimes the website gets offset to the left or right side if your finger isn't scrolling in a complete straight line (which is kind of annoying because you can see space at the edges of the screen). It happens vertically too, but its not as obvious.
I tried to use this code to disable it:
html, body { overflow-x: hidden; }
It does the job, but then it seems to mess up the javascript animations that I've put on some elements of each page. Anything that is supposed to have a 'fade in' effect doesn't load anymore when you scroll down.
I've taken the code off for now, but can I disable the horizontal movement without it affecting other elements?
I can see that the scroll is appearing only in your homepage and your blog page, i checked our demos and that horizontal scroll is not showing.
Even that I don't see that you have edited our theme from our Custom CSS area, I think that your theme is edited a bit and that scroll is happening because of a modification on your time or maybe a third-party plugin that you are using is causing this.
Please check if that problem is happening from your modifications bu disabling them until you check them and if you don't find any solution then you can apply this CSS code on the Custom CSS area that is provided on our theme.
Thanks for the input! You were completely right about something I did to modify the css that caused it. But this was only the case in the portfolio posts, which I fixed!
I inspected the code on my homepage and some other pages that had the same problem and determined that the similarity between the pages was the fact that I had a block with a row of content + background colour on the page (done with WP Bakery Page Builder), and somehow, whenever I did that, the theme automatically writes a code where the left/right column has a negative padding value. I never added left/right padding but the theme somehow just does it? For example, I discovered this code was the reason that caused my homepage to overflow:
So I just overwrote it with 0px and it worked! I don't know if that is something that might be helpful to take note of for the theme so I just wanted to let you know :)
Hi!
So I've noticed that the responsive mobile version of the theme has some horizontal movement. For example, when you're scrolling on an iPhone, sometimes the website gets offset to the left or right side if your finger isn't scrolling in a complete straight line (which is kind of annoying because you can see space at the edges of the screen). It happens vertically too, but its not as obvious.
I tried to use this code to disable it:
html, body {overflow-x: hidden;
}
It does the job, but then it seems to mess up the javascript animations that I've put on some elements of each page. Anything that is supposed to have a 'fade in' effect doesn't load anymore when you scroll down.
I've taken the code off for now, but can I disable the horizontal movement without it affecting other elements?
Hi Veronica,
I can see that the scroll is appearing only in your homepage and your blog page, i checked our demos and that horizontal scroll is not showing.
Even that I don't see that you have edited our theme from our Custom CSS area, I think that your theme is edited a bit and that scroll is happening because of a modification on your time or maybe a third-party plugin that you are using is causing this.
Please check if that problem is happening from your modifications bu disabling them until you check them and if you don't find any solution then you can apply this CSS code on the Custom CSS area that is provided on our theme.
.blog-posts.columns-gap-37 { margin-left: none !important; margin-right: none !important; }Have a great weekend!
Hi Ylli,
Thanks for the input! You were completely right about something I did to modify the css that caused it. But this was only the case in the portfolio posts, which I fixed!
I inspected the code on my homepage and some other pages that had the same problem and determined that the similarity between the pages was the fact that I had a block with a row of content + background colour on the page (done with WP Bakery Page Builder), and somehow, whenever I did that, the theme automatically writes a code where the left/right column has a negative padding value. I never added left/right padding but the theme somehow just does it? For example, I discovered this code was the reason that caused my homepage to overflow:
.vc_row {
margin-left: -15px;
margin-right: -15px;
}
So I just overwrote it with 0px and it worked! I don't know if that is something that might be helpful to take note of for the theme so I just wanted to let you know :)
Thank you for your help!
Hi Veronica,
Glad to hear that the problem is now solved.
Have a great week!