Text overlay is below slideshow images on mobile display. (DEBUT THEME)

Excursionist
31 0 2

Hello everyone!

 

The slideshow and text overlay work fine in the desktop version but for the mobile version, the text is positioned below instead of within the slideshow. 

 

Thank you!

 

I found a similar topic and someone suggested the code below but it didn't work for me.

@media only screen and (max-width: 749px){
   .slideshow__text-wrap--mobile{display:none;}
   .slideshow__text-wrap--desktop .slideshow__subtitle{display:block; text-align: center;}
}

 

Can anyone please help? I have attached a picture below.

 

*** Is it also possible to move the slider below the slideshow pictures instead of overlapping with the slideshow pictures?

 

Thank you!

 

Screenshot_20191012-202455 (2).png

0 Likes
Explorer
187 35 41

Hello 

 

@media only screen and (max-width: 749px){
.slideshow__text-wrap--mobile{display:none !important}
.slideshow__text-wrap--desktop .slideshow__title,.slideshow__subtitle{display:block !important;text-align:center !important}
.slideshow__btn{display:block !important;max-width:120px;margin-left:auto;margin-right:auto;margin-top:1rem}
}

 

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
If helpful then please Like and Accept Solution.
If you happy and want to donate small, click here: Paypal
1 Like
Excursionist
31 0 2

Hello Guleria!

Thanks so much for that code! 

It worked like a charm, however the text does not auto resize or wrap around within the slideshow. Is there anyway to fix that?

 

Thank you a million!

 

Screenshot_20191016-063457.png

0 Likes
Highlighted
Explorer
187 35 41

You can use width attribute a/to screen resolution in code.

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
If helpful then please Like and Accept Solution.
If you happy and want to donate small, click here: Paypal
0 Likes