I want to remove spacing/padding from the image listed on both mobile and desktop view. My website is cortofio.com, spacing is created between two different collapsible content sections.
1 Like
Hey @Cortofio
Follow these Steps:
- Go to Online Store
- Edit Code
- Find theme.liquid file
- Add the following code in the bottom of the file above </ body> tag
<style>
section#shopify-section-template--20802936111329__collapsible_content_kayLpa .accordion {
margin-top: 0 !important;
}
</style>
RESULT:
If you require any other help, feel free to reach out to me. If I managed to help you then a Like would be truly appreciated.
Best,
Moeed
1 Like
1 Like
Keep the previous code and add this new code right above </ style> in the end of your theme.liquid file
.footer {
border-top: unset !important;
}
RESULT:
If you require any other help, feel free to reach out to me. If I managed to help you then a Like would be truly appreciated.
Best,
Moeed
1 Like
Hi! Glad to hear the initial CSS adjustments worked. To remove the extra white space between collapsible content sections, you can override the margin or padding on the container element. For example, adding something like:
.collapsible-content,
.accordion__content {
margin-top: 0 !important;
padding-top: 0 !important;
}
will remove the default top margin/padding that the theme applies to each collapsible section. If you’re using Dawn or a similar Online Store 2.0 theme, you can place this snippet in your theme.liquid inside <style> tags or in your custom CSS file. Also, if the extra space is coming from the bottom margin of the previous section, you can set margin-bottom: 0 on that element.
And as Moeed mentioned, to remove the footer border line, you can use:
.footer {
border-top: unset !important;
}
Hope this helps! Let me know if you need any more assistance.
1 Like
