Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
I am trying to get H1, H2 and the button higher on the page. I want it to be the same on all my image_banner sections, since we use the same image size for all banners in the section. Is there a way to do this without messing with the desktop text?
Shoplivingsimply.com
In your section-image-banner.css file on line 377 you have the following code:
@media screen and (min-width: 750px) {
.banner__box > * + .banner__text {
margin-top: 2rem;
}
}
You can change the value of the margin-top parameter and move the text only on mobile version.
Try something like:
@media screen and (min-width: 750px) {
.banner__box > * + .banner__text {
margin-top: -10rem;
}
}
Thank you, but when I put in the code the attached happened?
I missed one of the brackets at the end, but nonetheless, this is what it did. I think it made it lower?
Try this one. It will be on this position on the mobile only. It will not be affected the desktop.
@media only screen and (max-width: 749px){
.banner__content.banner__content--top-left.page-width.scroll-trigger.animate--slide-in {
flex-direction: column;
justify-content: flex-start;
}
}