How to remove side padding from promotion grid Impulse theme

Store Design
, ,

Topic summary

A user needed help removing side padding from a promotion grid on their Impulse theme homepage while maintaining spacing between images.

Initial Solution Attempt:

  • First response provided CSS code targeting specific flex-grid classes
  • However, this removed all spacing including the gaps between images, not just the side padding

Working Solution:
The issue was resolved with updated CSS code that:

  • Removes left padding from advanced flex-grid items
  • Removes right padding from the promotion grid container
  • Includes a media query for mobile responsiveness (max-width: 749px)
  • Uses !important flags to override existing styles

Implementation Steps:

  1. Navigate to Online Store > Themes > Edit code
  2. Open the base.css file (or main.css/style.css depending on theme)
  3. Paste the corrected CSS code at the bottom of the file
  4. Save changes

The solution successfully removed side padding while preserving the spacing between grid images. The user confirmed it worked as intended.

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

Thank you but now the space in between the picture is gone as well.. It should only remove the side space (see red circles)