Shopify themes, liquid, logos, and UX
Running into an issue where without the following code two scroll bars appear on the side:
#MainContent {
overflow-x: hidden !important;
overflow-y: hidden !important;}
When I add this content to the bottom of theme.liquid the issue is resolved but now the code is displayed underneath my footer. Increasing my footer margin to cover the code or putting the lines of code anywhere else in the theme.liquid (within the body or <style>) re-introduces the two scroll bar issue.
Please help!
Website: https://asprovski.com/
Password: membersgetaccess
Solved! Go to the solution
This is an accepted solution.
@N_ASP I have checked your code. You can remove the code for #MainContent from your theme and try adding code below to the bottom of your base.css file.
.scroll-trigger.animate--slide-in {
transform: none !important;
}
This is an accepted solution.
@N_ASP I have checked your code. You can remove the code for #MainContent from your theme and try adding code below to the bottom of your base.css file.
.scroll-trigger.animate--slide-in {
transform: none !important;
}
This worked seamlessly. Thank you very much.
Hi @N_ASP
You just need to remove the code here and it will work as expected
Before https://prnt.sc/WnTGbwMURzF4
After https://prnt.sc/YQeClbgu3kvK
I hope this helps
Best,
Daisy
Hi @N_ASP,
Please follow these steps:
- Step 1: Go to base.css file and remove code here:
- Step 2: Go to theme.liquid file, find 'hidden !important' and remove code here:
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025