Shopify themes, liquid, logos, and UX
Hi,
I'm attempting to shift the button slightly lower, but this adjustment disrupts the layout, causing the button to touch the edge of the image, which is not the desired outcome. Additionally, the image banner appears zoomed in mobile view.
I want something like this: the "Shop Collections" button to be positioned right in the center with some space at the bottom.
I have two questions:
1. How can I move the button to the center without it touching the edges of the banner and without covering my text, especially in mobile view?
2. Is there a way to make the entire banner clickable without relying on the button?
Thank you for your help.
Please add this code at the bottom of your base.css file in Online store > Themes > Edit code
.banner__buttons .button,
.banner__buttons,
.banner__box,
.banner__content {
width: 100%!important;
height: 100%!important;
max-width: 100%!important;
padding: 0!important;
position: absolute!important;
top: 0px;
left: 0px;
opacity: 0;
bottom: 0px;
right: 0px;
margin: 0px !important;
}
- Helpful? Like and Accept solution! Support me: Buy coffee
- Ryviu - Reviews & QA app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024Thanks to everyone who participated in our AMA with 2H Media: Marketing Your Shopify St...
By Jacqui Sep 6, 2024The Hydrogen Visual Editor is now available to merchants in Shopify Editions | Summer '...
By JasonH Sep 2, 2024