Adjustment of content position on a mobile slideshow - Craft

Technical Q&A
1

HI, I’m looking to adjust the position of my content on the landing page slideshow on mobile devices. It’s currently auto positioning and creating a block under the photos. Im hoping to position it to the bottom left of the photo on mobile devices.

Any help is appreciated

Thanks

2

Hi @StylingAddicts

Would you mind to share your Store URL website? with password if its unpublish. Thanks!

3

Certainly,

https://stylingaddicts.co.uk/

Thank you

4

Thanks for the info, do you mean like this?

Made4uoRibe_0-1727964761564.png
Made4uoRibe_0-1727964761564.png571×739 299 KB

If it is check this one.

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

@media only screen and (max-width: 749px){
.slideshow__text-wrapper.banner__content {
    position: absolute;
    top: 55%;
}
.slideshow__media.banner__media.media {
    flex-grow: 1;
}
.slideshow__text.banner__box.content-container {
    background: transparent;
}
}

And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

5

Thank you that’s Perfect! I’ve adjusted the top % to get the positioning I want.

Thank you for the quick response!

6

Yes, sure. You can do that. Welcome.