Impulse theme - Map glitch on mobile view?

Store Design
, ,

Topic summary

A Shopify store owner encountered a layout issue with the Impulse theme where an address box appeared stacked on top of a map image instead of staying within it—but only on mobile view, while desktop displayed correctly.

Solution provided:

  • Add custom CSS code to the theme.css file
  • Navigate to: Online Store > Edit Code > Assets > theme.css
  • Insert media query targeting max-width 750px to adjust padding

Outcome:
The issue was resolved successfully with the CSS fix.

Summarized with AI on November 11. AI used: claude-sonnet-4-5-20250929.
1

Hi All,

I’m looking for help with this, the address box was stacked on top of the image below. It should stay inside the image below. I’m not sure why but this only happens on mobile view, the desktop view is fine.

Website: https://greentiger.co/

pw: cheese

Screenshot 2024-03-20 at 8.48.17 PM.png
Screenshot 2024-03-20 at 8.48.17 PM.png908×1058 151 KB

Screenshot 2024-03-20 at 8.50.17 PM.png
Screenshot 2024-03-20 at 8.50.17 PM.png882×886 238 KB

2

@greentigershop

please add the below css code into your theme.css file in the theme files.

Online Store > Edit Code > theme files > Assets > theme.css file.

@media only screen and (max-width: 750px) {
  .map-template--22205932503315__map_yUmfdU {
    padding-top: 0 !important;
  }
}

Thanks

1 Like
3

Thank you so much!!

1 Like