Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hi, I'm having the same issue outlined here:
https://community.shopify.com/c/technical-q-a/image-with-text-overlay-not-aligning-properly-on-mobil...
I just having trouble implementing it on my own site. My site is
glowupinc.store and the password is Enter
Any help would be greatly appreciated 🙂
Solved! Go to the solution
This is an accepted solution.
like this?
.banner__box {
max-width: 400px;
width: auto;
padding: 1rem !important;
background-color: #8ee4af;
border-radius: 10px;
}
.banner__content {
order: 2;
margin-top: -300px;
}
If me, I may try to add some CSS to the theme.css.liquid or at the Custom CSS box at the theme customization.
@media only screen and (max-width: 500px) {
.banner__buttons {
width: auto;
}
.banner__heading {
width: 100%;
}
.banner__box {
padding: 4rem 0rem
}
}
Okay I think its the container size because when I disable the container on mobile it works how I want but I can't seem to figure out to keep the container how it is on desktop
How about keep the container and adding CSS to modify the mobile view?
@media only screen and (max-width: 500px) {
}
Im trying to do that, still can't seem to make it work
It did the same as what you added.
First of all, try edit the .banner__box
remove
width:85%
add
padding: 4rem 0rem
and change the width of the .banner__heading from 90% to auto.
Hello, I did exactly what you outlined, but I still want the green box to show up on mobile. But, when I select the option for it to show up on mobile the text and buttons show up below the image
This is an accepted solution.
like this?
.banner__box {
max-width: 400px;
width: auto;
padding: 1rem !important;
background-color: #8ee4af;
border-radius: 10px;
}
.banner__content {
order: 2;
margin-top: -300px;
}
Perfect! Thank you so much!
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025