Padding input button on mobile

Store Design
, ,
1

Hello all,

I was wondering if any of you could help me with reducing the padding in the button. I tried to make the text bigger but it automatically makes it 2 lines

Screenshot 2024-11-01 100946.png
Screenshot 2024-11-01 100946.png217×223 8.71 KB

The code I currently have is :

@media only screen and (max-width: 768px) {
a.button,
input.button {
width: 70% !important;
min-height: calc(2.5rem + var(–buttons-border-width) * 2);
font-size: 6.5px;
}

www.hintofhappiness.com

pass : seiyud

Thanks in advance for your help !

Karla

2

Hi @Karla8

Thanks for your question, you can follow the instruction below to fix it :

  1. Go to Shopify > Theme > Customize > Custom CSS

  2. Copy and paste the code below to the section. You can adjust the font size by editing the number below.

@media only screen and (max-width: 768px) {
    .image-with-text__content > a.button {
        padding: 0 !important;
        font-size: 14px !important;
    }
}

I hope it helps.

Avada team

2 Likes
3

Hi

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

If my reply is helpful, kindly click like and mark it as an accepted solution.
If you are happy with my help, you can help me buy a COFFEEThanks!

1 Like