Space issue

Store Design
, ,

Topic summary

A Shopify store owner using the Warehouse theme needed help removing unwanted spacing around their newsletter section to make it seamlessly connect with the footer section. The issue involved gaps on the right, left, and bottom sides of the newsletter component.

Resolution Process:

  • Initial CSS code provided targeted only mobile devices using a media query
  • User clarified they needed the fix applied across all devices (desktop, laptop, tablet)
  • Final solution involved adding CSS to theme.css that:
    • Set newsletter container to full width (100%)
    • Adjusted background color and alignment
    • Removed bottom margin to eliminate gap with footer

Outcome:
The issue was successfully resolved. The user later requested the same CSS solution for a second website (imperialhighlandsupplies.co.uk), indicating they manage multiple stores with similar design needs.

The discussion includes screenshots showing the before/after states and the specific CSS code snippet needed for implementation.

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.
1

Hello Guys,

Please see attahced screenshot anyone please help me how we can joint newsletters section with footer section here is our website newsletters section you can see homepage buttom section

1000314692.jpg
1000314692.jpg1080Ă—2400 128 KB

1 Like
2

Hi @Everything1

TRy this one.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
@media only screen and (max-width: 749px){
div#shopify-section-sections--17559186735266__custom_liquid_kfRMdy section {
    margin-bottom: 0;
}
}

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

3

Thanks for your reply. Our theme is warehouse we buy from shopify theme app

4

I paste the code theme.css and code is work only for mobile device. I want same implement on all devices please like laptop, desktop, tab etc..

5

Please clarify the issue you’re experiencing. This is what it looks like on desktop.

Made4uoRibe_0-1740429358740.png
Made4uoRibe_0-1740429358740.png1887Ă—405 44.4 KB

6

Thanks for your reply. We want full width fill space right, left and buttom joint with footer see attahced screenshot i highlighted in red color

1000314764.jpg
1000314764.jpg2178Ă—1018 84.6 KB

7

Got it. Please disregard the previous code and use this one instead. The instructions remain the same.

.omnisend-reset-66914c75fd327c846262b2e6.omnisend-form-66914c75fd327c846262b2e6-content {
    max-width: 100% !important;
}

.omnisend-form-66914c75fd327c846262b2e6-content-inner {
    background-color: #3b0e57;
    justify-content: center;
    
}

div#shopify-section-sections--17559186735266__custom_liquid_kfRMdy section {
    margin-bottom: 0;
}

And Save.

Result:

Made4uoRibe_0-1740432290534.png
Made4uoRibe_0-1740432290534.png1500Ă—388 47.8 KB

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like
8

Wow…many many thanks for your help issue solved

9

Hi Dear,

I shall highly oblige to you if you send us same code for our new site imperialhighlandsupplies.co.uk