How can I design the form, width and alignment of a button?

  • Hans
    Asked on June 21, 2018 at 6:43 AM

    I want to create a button less wide than the form, at least 50% of the width or even smaller. How do I do this?

    Right now jotform seems to force me to use a button with the same width as the form, see screenshot

    Jotform Thread 1505144 Screenshot
  • Mike_G JotForm Support
    Replied on June 21, 2018 at 10:04 AM

    We will be glad to help you with your concern.

    To my understanding, the form is embedded on a website. May we just know the link to the website where your form is embedded, please?

    We will wait for your response.

  • Hans
    Replied on June 21, 2018 at 10:07 AM

    The form will be on www.arag.nl bus currently is under construction

  • Hans
    Replied on June 21, 2018 at 10:10 AM

    The form is not live yet

    Also (as you can see) we are struggling with the alignment of the fields... We don't see how to do this properly...

  • Mike_G JotForm Support
    Replied on June 21, 2018 at 11:27 AM

    We would like to help you align the fields in your form and make its submit button narrow when embedded on your website.

    Would it be possible for you to embed the form to your website so we can have a closer look at the issue?

    We will wait for your response.

  • Hans
    Replied on June 22, 2018 at 8:54 AM

    Dear Mike


    Please see here: https://www.arag.nl/intermediair/doe-mee/


  • luisvcsilva
    Replied on June 22, 2018 at 9:52 AM

    Inject the following CSS code in your form in order to reduce the width of the submit button:

    .form-submit-button {

        width : 50%;

        height: 30px;

        padding: 0px 0px 0px 0px;

    }

    .form-all {

        padding-top : 0;

    }

    Here's how your form will appear after this modification:

    1529675450result Screenshot 10

    You can clone a fixed version of your form here:

    https://form.jotform.com/81724369721966


    Feel free to contact us,

    Thanks.

  • Hans
    Replied on June 22, 2018 at 10:18 AM

    Hi Luis,

    Thanks a bunch - I will try this.

    One more thing: how to align the button to the right?

  • luisvcsilva
    Replied on June 22, 2018 at 10:35 AM

    While editing your form, select the submit button and set the Button Alignment to "Center" as shown by the image below:

    1529678113takeit Screenshot 10


    Let us know if you need further assistance,

    Thanks.