Hello,
I've been struggling with this for a while and nothing works.
I'm using the Brooklyn theme. I made some adjustments to the code to make the "image with text" section full width and change the background of it to a darker color. Unfortunately, there is now a weird space above the "image with text" section that I can't get rid of. You can see what I mean if you go to the site here: https://lukes-washer-games.myshopify.com/. Right below the top header image, there's a gap and then the "image with text" section.
Any ideas on how I can delete this gap?
Thanks so much in advance for any help!
Solved! Go to the solution
This is an accepted solution.
Adding the following at the end of theme.scss.liquid should do the trick:
#shopify-section-1604707356258b7d7c {
margin-top: 0;
}
However, be aware that if you add a new image with text section, it will have a different Id and the change will not be applied to the new section.
You would have to add the new section's id to this code like this
#shopify-section-1604707356258b7d7c,
#shopify-section-thisIsTheNewId
{
margin-top: 0;
}
There could be a safer and more permanent solution using a negative margin on a div inside the section.
Let me know if this first fix is enough for you and if not I will elaborate in the second option
If the solution fixes your issue please Like and Accept my answer
thanks
This is an accepted solution.
The more permanent solution
1. Open Sections/featured-row.liquid and in the first line:
change this:
<div class="wrapper">
to this:
<div class="wrapper feature-row__wrap">
Then at the end of theme.scss.liquid, add the following:
.feature-row__wrap {
margin-top: -90px;
}
.feature-row__wrap {
@include at-query($max, $medium) {
margin-top: -45px;
}
}
Please remember to Like and mark as Accepted my answer if it fixes your issue
thanks
User | Count |
---|---|
417 | |
205 | |
144 | |
54 | |
42 |