Align slideshow content on impulse theme for mobile sizes

Hi, I’m having issues positioning the slideshow content on the banner on impulse theme for mobile version.

I want the slideshow to look like this on Desktop (this one is showing ok).

But for mobile version I want the slideshow to look like this and have the text aligned.

but I’m having issues with that part, I need the content to be on top and centered on the slideshow on mobile version.

This is the CSS I have right now

.btn {
  color: #183170 !important;
  padding: 1rem;
  padding-left: 3rem;
  padding-right: 3rem;
  font-size: 25px;
}
@media only screen and (max-width: 1200px) {
  .animation-contents {
    text-align: center;
    display: block;
  }
  .btn {
    display: block;
    color: #183170 !important;
    padding: 0.5rem;
    padding-left: 0.1rem;
    padding-right: 0.1em;
    font-size: 15px;
  }
  h2 {
    margin: 0 auto;
  }
}

Help would be appreciated.

1 Like

Hi @DFU98

I understand what you want to do. Can you please provide your store URL, so that I can provide you a solution that can work for your store?

Yoo

Shishir Hasan | Shopify Developer

The link of the store is vitamiracle.com

Really appreciate your help @ShishirHelps .

Hi @DFU98

Do you want it like this?

Give me a message and add me as a staff on your dashboard. I will make it for free.

Yoo

Shishir Hasan | Shopify Developer

Yeah, Also forgot to place in the question is there a way to do a Breakpoint in the text?

I would like the text to look like that. As you can see there is a BR that I would like to have if possible in both, Desktop and mobile. Is there a way to do that too @ShishirHelps ?

Hi @DFU98

Yes, you can add a break point on your content dashboard.

1 Like

Already sent a DM @ShishirHelps

1 Like