What's your biggest current challenge? Have your say in Community Polls along the right column.

Re: Help! large gap under slideshow on Debut theme

Solved

Help! large gap under slideshow on Debut theme

LaurenPT
Tourist
8 0 2

I read through many posts to try and fix this myself, but nothing has worked. I'd like to minimize the gap between the slide show image and gallery image on my home page.

Any help would be greatly appreciated!

Site URL : https://theposhtech.com/

Accepted Solution (1)

dmwwebartisan
Shopify Partner
12323 2552 3732

This is an accepted solution.

@LaurenPT 

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

@media (min-width: 768px){
.slideshow-wrapper {
    height: auto !important;
}
}

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Replies 10 (10)

Guleria
Shopify Partner
3691 741 1039

Hello @LaurenPT ,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid  paste bellow code in bottom of file

 

@media (min-width: 768px){
.slideshow-wrapper {
    height: 100% !important;
}
}

 

Thanks

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder
LaurenPT
Tourist
8 0 2

Thanks so much for the reply. I tried your suggestion and unfortunately it put the whole home page out of order and I had to remove the code. 

Guleria
Shopify Partner
3691 741 1039
@media (min-width: 768px){
.slideshow-wrapper {
    height: 100% !important;
}
}

My mistake I forget to close the brackets. Try again it will work.

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder
LaurenPT
Tourist
8 0 2

I tried again and it didnt work, looking at the codes you sent. I cant see a difference, but that could just be me!

Majit
Shopify Partner
9 0 2

@LaurenPT  Are you talking about my codes?

LaurenPT
Tourist
8 0 2

Hi @Majit

Thanks for the help and no i was not referring to your codes. I just tried to follow your instructions and the only @media I could find was the below

 

@media only screen and #{$declaration} {
@content;

Majit
Shopify Partner
9 0 2

.slideshow-wrapper search with this in your theme.css file. Or send me a private message. 

Majit
Shopify Partner
9 0 2

Find this code in your theme.sccss/theme.css file and replace the height with height: auto;


@media (min-width: 768px)
.slideshow-wrapper {
height: auto;
}

If this doesn't help please let me know.

dmwwebartisan
Shopify Partner
12323 2552 3732

This is an accepted solution.

@LaurenPT 

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

@media (min-width: 768px){
.slideshow-wrapper {
    height: auto !important;
}
}

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
LaurenPT
Tourist
8 0 2

@dmwwebartisan  thank you so much! that worked!