Shopify themes, liquid, logos, and UX
Hello!
I have used a multirow element on my website to show a menu. It was initially full width elemnet, but I made it slightly narrower as I preffered the overall look. The issue is the element now isn't aligned and looks off center on a desktop device. Here is a link to the page:
https://batchedcookies.co.uk/pages/cookie-menu
Is there a way to align the element? Also, is it possible to make the image boxes slightly smaller on a mobile device as they are currently taking up a lot of the page?
Many thanks,
Liam
Solved! Go to the solution
This is an accepted solution.
Hey @liambeauchamp,
In the same code you added the 120rem, add another line for auto margin
margin: auto
The whole code is
#shopify-section-template--19628476072204__multirow_WcAnL4 .multirow {
max-width: 120rem;
margin: auto;
}
Hey @liambeauchamp
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.
<style>
#shopify-section-template--19628476072204__multirow_WcAnL4 .multirow {
max-width: 100% !important;
}
</style>
RESULT:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
This is an accepted solution.
Hey @liambeauchamp,
In the same code you added the 120rem, add another line for auto margin
margin: auto
The whole code is
#shopify-section-template--19628476072204__multirow_WcAnL4 .multirow {
max-width: 120rem;
margin: auto;
}
Thank you! That worked perfectly 🙂
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn 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, 2025