How do i reduce spacing between sections? / Stockholm Theme

Solved

How do i reduce spacing between sections? / Stockholm Theme

SnabbaSimon
Excursionist
16 1 2

Hello Everyone. 

Need help with the design on my Stockholm themed store. The spacing between my header and collections on the first page is to much. How do i reduce it? 

SnabbaSimon_0-1721055841136.png



My store Url: https://www.guldklippet.se/

Thanks in advance!
Regards Simon

Accepted Solutions (2)
SnabbaSimon
Excursionist
16 1 2

This is an accepted solution.

Thanks for quick answer and for the help!

It worked on the Featured Collections with pasting the code. 

On the picture (Below) it looks like that section Slide Show has also to much margin/spacing with the white in the element. Is there a way to reduce that to?

Thanks

SnabbaSimon_0-1721058752569.png

 

View solution in original post

Gideon11
Shopify Partner
46 5 5

This is an accepted solution.

Yes, to Solve that;

1. Go to Image banner (Bildbanner),

2. Scroll to the bottom and click custom css,

3. paste the following;

 

 

.image--top .image-banner__wrapper {
    /* Customize margin as much as you like, you can attempt 25px like below */
    margin-top: 25px;
}

 

Please mark both as solution if they've worked for you

 

View solution in original post

Replies 6 (6)

BSS-TekLabs
Shopify Partner
2401 695 835

- Here is the solution for you @SnabbaSimon 
- Please follow these steps:

step.png

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.featured-collection-section {
margin-top: 0px !important;
}

- Here is the result you will achieve:

BSSTekLabs_0-1721057154611.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now
BSS-TekLabs
Shopify Partner
2401 695 835

@SnabbaSimon you can add more code

.image--top .image-banner__wrapper {
    margin-top: 0 !important;
}

BSSTekLabs_0-1721059004864.png

 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

Gideon11
Shopify Partner
46 5 5

Hi, 

1. Click Featured Collections (utvald Produktserie).
2. scroll to the bottom, and click custom css.
3. Paste the following code.

 

.spaced-section {
     margin-top: 0;
}

@media screen and (min-width: 990px) {
  .spaced-section {
    margin-top: 0;
 }
}
SnabbaSimon
Excursionist
16 1 2

This is an accepted solution.

Thanks for quick answer and for the help!

It worked on the Featured Collections with pasting the code. 

On the picture (Below) it looks like that section Slide Show has also to much margin/spacing with the white in the element. Is there a way to reduce that to?

Thanks

SnabbaSimon_0-1721058752569.png

 

Gideon11
Shopify Partner
46 5 5

This is an accepted solution.

Yes, to Solve that;

1. Go to Image banner (Bildbanner),

2. Scroll to the bottom and click custom css,

3. paste the following;

 

 

.image--top .image-banner__wrapper {
    /* Customize margin as much as you like, you can attempt 25px like below */
    margin-top: 25px;
}

 

Please mark both as solution if they've worked for you

 

SnabbaSimon
Excursionist
16 1 2

Thanks alot 🙂 

Have a good day!