How can I adjust the column gap in a multicolumn section?

Store Design
,

Topic summary

A user sought help narrowing the column gap in a multicolumn section on their Shopify store’s home page using the Dawn theme. They provided screenshots highlighting the excessive spacing between columns.

Solution provided:

  • Navigate to Online Store → Themes → Customize
  • Select the Multicolumn section
  • Add custom CSS code to the “Custom CSS” field

CSS code:
The solution involves targeting .multicolumn-card__image-wrapper and .multicolumn-card__info classes, setting their margins and padding to 0px with !important flags to override default spacing.

Outcome:
The original poster confirmed the solution worked perfectly, marking the issue as resolved.

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

Hi!

[Multicolumn section on home page / Dawn theme ]

Could someone please help me to find a way to narrow the gap in the column as noted in yellow highlight in the screengrab. So that the image and the title below it are in line with the main menu.

Is it the image wrapper that needs adjusting?

Thanks in advance!

multicolumn-border.png
multicolumn-border.png725Ă—1061 282 KB

2

Another image to help you understand:

columngrab2.png
columngrab2.png1038Ă—1026 137 KB

3

@cdgerard

Please follow below steps to adjust the space in multicolumn. Let me know whether it is helpful for you.

  1. From admin, go to “Online Store” → “Themes” → “Customize”.
  2. Click “Multicolumn” section.

Vinsinfo_2-1713251266149.png
Vinsinfo_2-1713251266149.png420Ă—789 28.6 KB

  1. Paste the below code in “Custom CSS” field as shown in the below screenshot.
.multicolumn-card__image-wrapper {
    margin: 0px !important;
}
.multicolumn-card__info {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

Vinsinfo_1-1713251253776.png
Vinsinfo_1-1713251253776.png421Ă—714 32.8 KB

Now, it will be shown like below image,

Vinsinfo_0-1713250672068.png
Vinsinfo_0-1713250672068.png1366Ă—867 160 KB

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.

2 Likes
4

Works perfect, thanks a lot!