How to change margin above title on pages (mobile view). Brooklyn theme

Technical Q&A
1

Hey!
I have a struggle with the margin above the title on all my pages. The text is now behind the “navigation bar” (I have made it sticky) which does not look good at all. How do I get the text to be below the navigation bar instead? It looks fine on desktop view (the title is then below the navigation bar) but on phones it looks bad. Pls see screenshot.

This is my store url: https://racketbollen.se/
Password: dobewrr

I cross my fingers that there is anyone out there who knows how to solve this!

Screenshot_20210913_105146_com.android.chrome.jpg
Screenshot_20210913_105146_com.android.chrome.jpg1080×2240 111 KB

2

Hello there.

  1. Go to Online Store->Theme->Edit code
  2. Asset->/timber.scss.liquid->paste below code at the bottom of the file.
@media screen and (max-width: 749px){
div#CollectionSection {
margin: 20% 0;
}
}
3

Wow, thanks a lot. Looks perfect!

4

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.

5

Thank you very much!
One more question… It works great on collection pages, but do you also know how to change the margin for other pages like “about us” page and terms of conditions page etc?

Best regards.