Craft theme - header margin error

Hi guys,

Something weird is happening with the header on my Craft theme. I’ve tried a few “margin-bottom: -80px” code, but some will take spacing off the mobile view from the section below so I’m not sure where it’s going wrong!

Then I added this code below, but it caused the other pages on desktop to be cut off at the top.

Any other solutions for this? Thanks!

@media (min-width: 749px) {
   {
    margin-bottom: -80px;
  }
}

website

1 Like

Hi @INFRA , Can you kindly share your store link with us? We will check it and suggest you a solution if possible.

Hi @INFRA ,

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!

Hi @INFRA ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above tag:


Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

HEllo @INFRA

Go to online store ----> themes ----> actions ----> edit code---->base.css ----> line number 149
search this code and delete and then save.

.section + .section {
margin-top: var(--spacing-sections-mobile);
}

@media screen and (min-width: 750px) {
.section + .section {
margin-top: var(--spacing-sections-desktop);
}
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

Hello @INFRA

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.section+.section { margin-top: 0 !important; }

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.