Section Overlaps Header

mika94
Tourist
4 0 1

 How do you move the section down so it will not overlap the header? I am not so sure how to modify the code to do this. The theme is Venture.

This is the URL

https://urbanhouseclothing.com/

 

g33kgirl
Shopify Partner
211 51 64

UPDATED CODE: You can add this at the end of your CSS file (Themes -> Edit code -> Assets -> theme.scss.css

 

#shopify-section-slideshow + div {
  margin-top: 100px;
}

 

 

 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl ☕
If you're not comfortable with code, please modify code files at your own risk.
Do NOT give out your passwords unless absolutely necessary.
0 Likes
mika94
Tourist
4 0 1

Do I add a new section and then add this code? 

0 Likes
g33kgirl
Shopify Partner
211 51 64

No, you need to navigate to Themes -> Actions -> Edit code -> Assets -> themes.scss.css (scroll to the very end of this file and add the above code there). I have added pictures for reference:

Screenshot 2021-04-29 at 1.46.34 am.png

Screenshot 2021-04-29 at 1.46.51 am.png

 

Screenshot 2021-04-29 at 1.52.30 am.png

 

Don't forget to SAVE the file.

 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl ☕
If you're not comfortable with code, please modify code files at your own risk.
Do NOT give out your passwords unless absolutely necessary.
0 Likes
dmwwebartisan
Shopify Partner
5731 1308 1682

@mika94 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media only screen and (max-width: 749px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

@media only screen and (min-width: 750px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

Hope this works.
Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
Natztech
Shopify Partner
602 156 381

@mika94 please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (max-width: 749px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 30px !important;}
}

@media only screen and (min-width: 750px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
mika94
Tourist
4 0 1

So to confirm this will move the section down right so it will not overlap with the header slideshow?

Hope I am using the right terms.

 

Screen Shot 2021-04-29 at 1.06.40 AM.png

0 Likes
Natztech
Shopify Partner
602 156 381

yes  confirm this will move the section down please insert code 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
dmwwebartisan
Shopify Partner
5731 1308 1682

@mika94 

Please PM to me I help you.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes