Submit Button style is different from the cloned form

  • TLX
    Asked on March 14, 2018 at 11:28 AM

    So somehow I broke my one sheet, so I used a different one to get the style right (they're the same form just the content is different) but I cannot get the submit buttons right.

    I opened the advanced designer and have the settings exactly the same yet they look funky. 


    I put a picture of the settings side to side and you can see the messed up buttons in that one. I put the link to the page with the correct buttons on it. 


    Anyone know what it could be?

    Jotform Thread 1414804 Screenshot
  • Elton Support Team Lead
    Replied on March 14, 2018 at 12:13 PM

    I think you've made changes on the button width that's why it now limits the width of the button.

    To remove the width limit, inject this CSS code in your form.

    .form-all .qq-upload-button, .form-all .form-submit-button, .form-all .form-submit-reset, .form-all .form-submit-print {width: auto !important;}

    Guide: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Result:

    Submit Button style is different from the cloned form Image 1 Screenshot 20

    If you need anything else, let us know.

  • TLX
    Replied on March 14, 2018 at 12:38 PM

    Sweet! So that fixed the sizing issue, any idea why the background color isn't what I have selected? Submit Button style is different from the cloned form Image 10

  • Elton Support Team Lead
    Replied on March 14, 2018 at 12:56 PM

    Switch the button style to default within the form builder. This might fix it.

    Here's how:

    1. Click the submit button then open its properties (click the gear icon)

    2. Click the Button Style to change it then select the default button (first white button)

    Here's a visual guide:

    Submit Button style is different from the cloned form Image 1 Screenshot 20

  • TLX
    Replied on March 14, 2018 at 1:03 PM

    That was it! Thank you!