How to make buy now button smaller on mobile

Store Design
,
1

Hello, I want to make the buy now button on my image banner smaller for mobile only. I am using dawn theme !

2

Hello @SamTheMaker

It’s GemPages support team and glad to support you today.

You can follow these steps:

  1. Go to Online Store → Theme → Edit code

  2. Open your base.css file and paste the following code below:

@media screen and (max-width: 749px){
  .banner__content .banner__buttons .button{
     padding: 10px 15px;
     min-width: auto;
     min-height: auto;
  }
}

Let us know how it works for you.
Best regards,
GemPages Support Team

3

Hi @SamTheMaker

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css.

Step 3: Paste the below code at bottom of the file → Save

@media screen and (max-width: 749px){

a.button.button–secondary {

font-size: 1rem !important;

min-width: 90px !important;

min-height: 30px !important;

}

}

PageFlyVictor_0-1675414359185.png
PageFlyVictor_0-1675414359185.png308×111 36.4 KB

Hope my solution works perfectly for you!.

Best regards,

Victor | PageFly