Shopify themes, liquid, logos, and UX
Hi,
I have a Prestige theme. I added a new section using the 'timeline' block to a page. It stacks for mobile view which is fine, but in desktop view the margin does not extend to the full width.
I can see a custom CSS section for that section/block within the shopify editor.
Is there a way to show the margin for this section full width? Or even centre this block section? And if so, add the code directly in the editor within the CSS section?
Any help would be appreciated.
Many thanks!
Hi, @She89
Can you share the store URL and take a screenshot to describe your requirements? So that I can assist you.
Hi, thank you - I have added screenshots now to the original post.
Add the code below to the custom css input
.container {
margin: 0;
}
Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!
Thank you but that code did not work when I added it to the custom css section
Please follow.
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find your section and custom file section
4) Add the following code in the bottom of the file add css
Hi. Is this the effect you want?
Hi, yes, I just want the timeline section to extend the full size/witdth of the desktop screen. The existing depth of the timeline can stay, it's more the width/length. So it goes to the edge of the screen and not look cut off like it currently does.
Maybe the version is diffenent. Can you share the store url with me?
Hello @She89
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find your section and custom file section
4) Add the following code in the bottom of the file add css
<style>
#shopify-section-{{ section.id }} .container {
max-width: 100%;
margin: 0;
}
</style>
If I managed to help you then, don't forget to Like it and Mark it as a Solution!
Best Regards,
Rakesh patel
Thank you, I was trying to find the code to add it within the editor instead in the custom css section for the timeline block.
Hello @She89
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find your section timeline.liquid
4) Add the following code in the bottom of the file add CSS
<style>
#shopify-section-{{ section.id }} .container {
max-width: 100%;
margin: 0;
}
</style>
its working
@She89 I am prestige theme expert, can you share the Url of your website. so i can check and give you best solution without ant custom CSS.
Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024In today’s interview, we sat down with @BSS-Commerce to discuss practical strategies f...
By JasonH Nov 13, 2024