Solved

Debut Theme: Gallery section won't sit flush with slide show in mobile view

gulftacklesuppl
Tourist
7 0 2

Hey guys 

I am having trouble getting my gallery images to sit nicely in mobile view. The 'better fishing starts here' is an image and sits nicely under my gallery in desktop but in mobile view it looks really out of place 

Screen Shot 2021-08-05 at 6.21.28 PM.png

Accepted Solution (1)
dmwwebartisan
Shopify Partner
12280 2546 3694

This is an accepted solution.

@gulftacklesuppl 

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){
.index-section--slideshow+.index-section--flush {
    margin-top: -3.6rem !important;
}
}

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 9 (9)

dmwwebartisan
Shopify Partner
12280 2546 3694

@gulftacklesuppl 

Please share shop URL and screenshot what do you want!

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
gulftacklesuppl
Tourist
7 0 2
dmwwebartisan
Shopify Partner
12280 2546 3694

@gulftacklesuppl 

Shop password not working !

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
gulftacklesuppl
Tourist
7 0 2

sorry 

gulftackle1

gulftacklesuppl
Tourist
7 0 2

this is what i want it to look like in mobile view 

IMG_0379.PNG

dmwwebartisan
Shopify Partner
12280 2546 3694

This is an accepted solution.

@gulftacklesuppl 

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){
.index-section--slideshow+.index-section--flush {
    margin-top: -3.6rem !important;
}
}

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
gulftacklesuppl
Tourist
7 0 2

thanks you so much!

gulftacklesuppl
Tourist
7 0 2

is there anything similar to make my gallery sections full width in mobile view also? thy are currently like this

  IMG_0380.PNG.   IMG_0381.PNG

dmwwebartisan
Shopify Partner
12280 2546 3694

@gulftacklesuppl 

Please add this code your css file .

@media only screen and (max-width: 749px){
.template-index .image-bar {max-width: 100% !important; margin: 0 auto;}
}
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