Change text position on Slidesow (Dawn Theme)

Store Design
, , ,
1

Hey,

I want to move the text in the picture slideshow on mobile (Dawn Theme). But whenever I change the padding in the CSS code, the background image also gets bigger. Am I doing something wrong?

My website is: https://meme.london

IMG_2379.jpg
IMG_2379.jpg1170Ă—2532 236 KB

2

Hi @annamichielan ,

Please go to Actions > Edit code > Assets > base.css file and paste this at the bottom of the file:

@media screen and (max-width: 749px) {
.slideshow__text.banner__box {
    min-height: 39rem;
    justify-content: flex-start;
}
.slideshow__text.banner__box .banner__buttons {
margin-top: 12rem;
}
}
3

Hi,

Thank you for your response. Unfortunately, the layout didn’t seems to change at all :disappointed_face:

4

Hi @annamichielan ,

Please change code:

@media screen and (max-width: 749px) {
  .slideshow__text.banner__box {
    min-height: 39rem !important;
    justify-content: flex-start !important;
  }
  .slideshow__text.banner__box .banner__buttons {
    margin-top: 12rem !important;
  }
}

it will display like this:

Screenshot.png
Screenshot.png368Ă—574 199 KB

5

Hi Namphan,

sorry I wasn’t clear.

I meant I would like the “meme london sale up to 60% sitewide” to be on the location marked :smiley:

IMG_2379.jpeg
IMG_2379.jpeg1170Ă—2532 247 KB

Thank you :blush:

6

Hi @annamichielan ,

Please change code:

@media screen and (max-width: 749px) {
  .slideshow__text.banner__box {
    min-height: 39rem !important;
    justify-content: flex-end !important;
  }
  .slideshow__text.banner__box .banner__buttons {
    margin-top: 3rem !important;
  }
}
1 Like
7

That’s perfect! Thank you so much :blush:

1 Like
8

Hi @annamichielan ,

If you have any further questions, you can contact me.

Happy to help you