How can I adjust the banner button position and make banner clickable in Dawn theme?

New Member
4 0 0



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.

Screen Shot 2024-01-17 at 21.41.14.png


I want something like this: the "Shop Collections" button to be positioned right in the center with some space at the bottom.

Screen Shot 2024-01-17 at 21.52.42.png


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.

Reply 1 (1)

Shopify Partner
7726 1502 1510

Please add this code at the bottom of your base.css file in Online store > Themes > Edit code

	.banner__buttons .button,
	.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 or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now