How to adjust the spacing between collections in Brooklyn Theme?

Technical Q&A

Topic summary

A user added a 10th collection to their Brooklyn Theme (which typically displays 9) by removing collection titles to create a flowing layout. However, this resulted in unwanted spacing between collections.

Solution provided:

  • Navigate to Online Store > Themes > Edit code
  • Open the theme.scss file in the Assets folder
  • Add CSS code at the end: #shopify-section-[ID] { margin-top: 0; }
  • This removes the top margin, moving the last two collections upward

Outcome: The solution successfully resolved the spacing issue, with the original poster confirming it worked.

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

Hi! Brooklyn Theme allows 9 collections. I have added another collection (and deleted collection title) so that it would flow.. Now I have a small space between collections though. Does anyone know a code to paste to move the last 2 collections a bit more up.

Screenshot_2023-04-25-18-16-02-642_com.android.chrome.jpg
Screenshot_2023-04-25-18-16-02-642_com.android.chrome.jpg1080×2340 254 KB

Many thanks!

Eva

1 Like
2

Hi @evaoherjus ,

I understand that you want your other collection to move up. Please follow the instructions below

  1. From you Admin page, go to Online store > Themes > Click the three dots on the theme you want to edit > Edit code
  2. Go to Asset folder and open the theme.scss file
  3. At very end of the code, add the code below
#shopify-section-4b209155-9ee6-451c-a376-a3c631783837 {
    margin-top: 0;
}
1 Like
3

Yayy so glad I asked. You’re a star!! Thanks!

Screenshot_2023-04-25-18-42-26-183_com.android.chrome.jpg
Screenshot_2023-04-25-18-42-26-183_com.android.chrome.jpg1080×2340 264 KB