I'd like to change the button size of Submit Button on mobile devices.

Anonymous

#214643

Hi,

Thank you for providing the very nice plug-in. I’m very satisfied.

I’m a beginner of php and css.

I have a question about how to change the size of Submit Button on mobile device.

Please look at my search form https://data.golfclubsuuchi.com/mobile_search_form/
with your PC. There is a Submit Button at the bottom of the form. You can see that the size of the Submit Button is well-balanced. I like that size.

Then, please look at the same search form with your mobile phone. You can see that the Submit Button is very thinner than the PC’s. I’d like to make it thicker. In other words, I’d like to make the height of the button higher. I also would like to make the font-size bigger.

Can I resolve those issues with additional css? Please advise.

Best regards,
Kenichi Kato

Anonymous

#214644

Sorry. I was able to solve the issue by myself by adding the following css.

.searchandfilter input[type=”submit”] {
font-size: 19px;
}

No need to reply. Thank you anyway.

Best regards,
Ken

Trevor

#214708

Did you also use a CSS Media query to target mobile devices?

Anonymous

#214749

This reply has been marked as private.

Trevor

#214795

A CSS media query is like this:

@media only screen and (max-width : 767px) {
  .searchandfilter input[type=”submit”] {
    font-size: 19px;
  }
}

In this case, applying it only on screens of 767px width or less. You theme will have a responsive breakpoint for mobiles (which may well be different to that example above.

[Author]

Posts