How do I move text to the top of my image banner on mobile view only

Hi

I’m more than happy with how my Image Banner looks on desktop view however the placement of the copy on mobile view is terrible. Can someone help with how I am to move the copy to the empty space above,

If it helps Im using the Enterprise theme.

Hi @nicfaiths

Could you share your store link?

This?
https://223dc7-4.myshopify.com/

Really sorry, complete newbie here

Password protected, please

Hi @nicfaiths

Would you mind to share the store password? This is where youll find the password.

Go to theme > Online store > and click the button (See store Password)

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

shaoth

Go to your Online store > Themes > Edit code > open main.css file, add this code at the bottom and save file

@media (max-width: 767px) {
#shopify-section-template--18119327613196__ba0bad3d-57c4-4a57-b0b8-8a8ef01f82b7 .image-banner .container {
padding: 0px !important;
}
#shopify-section-template--18119327613196__ba0bad3d-57c4-4a57-b0b8-8a8ef01f82b7 .image-banner .container .text-overlay {
position: absolute !important;
top: 10px;
}
#shopify-section-template--18119327613196__ba0bad3d-57c4-4a57-b0b8-8a8ef01f82b7 .image-banner .container .text-overlay .text-overlay__heading {
font-size: 30px !important;
}
}

Ahhh, thank you. That worked perfectly

You are very welcome

Hi Dan,

I experience a similar problem.

I also want to move my banner text to the top on the mobile version.

Your solution did not work with my theme unfortunately. It concerns the Prestige theme.

https://luyendykjewelry.com/

Could you please help me with this?

Thank you in advance!

Hi @Chrystel078

You can add this code to Custom CSS of your banner section in Online Store > Themes > Customize to do that.

@media (max-width: 749px) {
.Slideshow__Content { top: 100px; }
}

Amazing, I have been trying for so long. Thank you!