Change the submit button font line height and other styles

  • Profile Image
    Asked on June 26, 2016 at 05:31 AM

    How can I change the line height of the text on this button? I've tried using the Designer edit functions but line height always stays the same.

  • Profile Image
    Answered on June 26, 2016 at 07:46 AM

    Line height is the distance in pixels between 2 lines. Please check with the following image.

    You can edit the css as 

    .form-submit-button {

        margin-right : auto;

        line-height : 30px;

        font-size : 30px;


    Let us know if this is what you are looking for. Thanks!


  • Profile Image
    Answered on June 26, 2016 at 09:58 AM

    In addition to my colleague's answer try to insert this CSS code. This will minimize the submit button height.

     .form-all .qq-upload-button, .form-all .form-submit-button, .form-all .form-submit-reset, .form-all .form-submit-print {

    height: 44px !important;


    You can change the value if you want.


  • Profile Image
    Answered on June 26, 2016 at 10:13 AM

    Please check out my colleague's solutions and let us know how it goes.


  • Profile Image
    Answered on June 26, 2016 at 10:50 AM

    Thanks. I've tried these solutions and made some progress but the buttons still don't look right. I want all the font formatting to be the same. Please view these pages to see the errors:

  (font should be bold; button should be narrower) (line height is wrong) (line height and button width are wrong; font should be bold).


    I am also having difficulty integrating the Khand Google font of the buttons. This font appears in the editor but not in the live versions. Can you advise?

  • Profile Image
    Answered on June 26, 2016 at 11:11 AM

    You have so many CSS codes injected in your form for the submit button field. Some of them are having conflicts and some are not properly declared which creates errors on the editor. So I went ahead and fix the submit buttons for you. 

    I have also added your custom Google font - Khand.

    The default font size on the CSS code is 30px, feel free to change it according to your preference. It is found on the injected CSS codes - bottom part.

    Kindly check your forms now and let us know if you need anything else.


  • Profile Image
    Answered on June 26, 2016 at 01:08 PM

    Many thanks!

  • Profile Image
    Answered on June 26, 2016 at 01:11 PM

    We are glad that the solution provided by my colleague worked for you. Should you have any other questions or concerns, please feel free to contact us anytime.