reduce padding for logo in footer (mobile only)

[ads18922]

hello, i would like to reduce the bottom padding for my image in my footer:

as you can see, the gap between the image and menu is quite big, i would like it reduced

my website is www.antico-abito.com , theme is dawn

[suyash1]

@ads18922 please add this css to the very end of your base.css file and check,
Shopify Admin -> Online Store ->Theme -> Edit code -> base.css

@media (max-width: 749px) {
.footer-block__details-content.footer-block-image.center {margin-bottom: 0px;}
.footer-block.grid__item{margin: 0rem 0;}
}

[lennydev · Accepted solution]

This isn't the best code practice but it'll do. Paste this somewhere in your CSS file:

@media screen and (max-width: 749px) {
.footer-block.grid__item:first-of-type {
margin-bottom: -40px !important;
}
}

[mt686]

Hey there!

I can see that large gap between your footer logo and the menu links. Here's how to reduce that bottom padding:

Solution: Reduce footer logo spacing

1. Go to Shopify Admin → Online Store → Themes → Actions → Edit Code
2. Find assets/base.css
3. Add this CSS:

/* Reduce footer logo bottom spacing */
.footer__content-top .footer__logo {
  margin-bottom: 10px !important;
}

.footer__logo img {
  margin-bottom: 0 !important;
}

/* Alternative selector if above doesn't work */
.footer .footer-block--logo {
  margin-bottom: 15px !important;
}

If you want even tighter spacing, try:

.footer__logo {
  margin-bottom: 5px !important;
  padding-bottom: 0 !important;
}

This should significantly reduce that gap and bring your menu links closer to the logo.

Alternative: With Easy Edits, you could just click on that logo and adjust the spacing visually by dragging - no CSS needed!

Try the first code snippet and let me know if you need the spacing even tighter!