How to change button position on Dawn theme mobile

Hi! I would like to have the Dawn theme banner buttons aligned at the bottom center on mobile version. From the Dawn theme settings I can only see the possibility to do this for the desktop version. Can you please suggest how to do it on mobile version?

Store: https://grainlyfoods-com.myshopify.com/

PW: Grainly

1 Like

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset >base.css and paste this at the bottom of the file:
@media screen and (max-width: 749px){
div#Banner-template--15478446620831__1646741839c1ec077c {
position: relative;
}

div#Banner-template--15478446620831__1646741839c1ec077c .banner__content {
position: absolute;
bottom: 0;
}
}

Thank you very much. However, it did not work for me. I have a few other edits that I found in the discussions. Such as having different banner images for desktop and mobile: https://community.shopify.com/c/shopify-design/separate-banner-images-on-mobile-and-desktop-dawn-theme/td-p/1362462

As well as setting the banner text color: https://community.shopify.com/c/shopify-design/dawn-theme-image-banner-changing-text-font-colour-and-weight/td-p/1363207

Maybe your solution somehow does not work because of other edits.