Move the submit button next to the email field

  • Mario_Acosta
    Fecha de consulta 3 de octubre de 2023, 11:24

    hola jotform


    quiero poner el boton de submit al lado de la casilla de pregunta

    cómo lo hago?


    Jotform Thread 7763162 Screenshot
  • Afzal Jotform Support
    Fecha de respuesta 3 de octubre de 2023, 17:29

    Hi Mario,

    Thank you for reaching out to Jotform Support. I am currently using a translation to provide assistance, but if you want to get assistance in Spanish language, we can forward your request to our Spanish Support Team, but please note that it may take longer to receive a response.

    I understand you want to put the Submit button next to the email field. This can be done by adding custom CSS to your form. Check out the steps and screencast below to see how it's done:

    • Open your form in Form Builder and click on the blue Paint Roller icon on the right side of the screen.
    • Under the Styles tab, paste the code below into the Inject Custom CSS area.
    /*Move the submit button next to email - 7763162*/
    .form-line {
        max-width: 48%;
    }

    div#cid_3 {
        width: 100%;
    }

    li#id_2 {
        margin-top: 24px;
    }

    .form-buttons-wrapper
    .form-submit-clear-wrapper {
        border-top: none;
    }
    • Click on Save, and you're done.

    Move the submit button next to the email field Image 1 Screenshot 30

    Here's what the result will look like:

    Move the submit button next to the email field Image 2 Screenshot 41

    Here's the cloned version of the form that you can test.

    Please give it a try and let us know how it goes. 

  • Mario_Acosta
    Fecha de respuesta 7 de noviembre de 2023, 9:25

    Hi Azfal


    i already put the code where u told me but now we have name and email and it doesnt look very well

    Move the submit button next to the email field Image 1 Screenshot 20

  • Gilbert Jotform Support
    Fecha de respuesta 7 de noviembre de 2023, 11:32

    Hi Mario_Acosta,

    The CSS code provided by my colleague Afzal is for your previous form setup with only one field. If you're not yet finished building the form, it would be best to add all the fields first and then get back to us so we can generate the CSS code to place the Submit button beside a specific field. Also, once you're done building the form, let us know which particular field you want to place the Submit button next to.

    Let us know if you have any other questions.

  • Mario_Acosta
    Fecha de respuesta 7 de noviembre de 2023, 16:01

    Hola Gilbert


    Este sería el formulario. Lo que deseo es que el botón quede a la derecha y también me gustaría poder disminuir el tamaño del formulario

    eso se podria?

    gracias!



    Move the submit button next to the email field Image 1 Screenshot 20

  • Jovanne Jotform Support
    Fecha de respuesta 7 de noviembre de 2023, 19:33

    Hi Mario_Acosta,

    Are you perhaps working on the Formulario Form? I checked the form and the submit button is moved next to the email field. Check out the screenshot below to see my results:

    Move the submit button next to the email field Image 1 Screenshot 20

    Can you try clearing your browser cache or try using a different browser or device and see if that makes any difference? If you run into the same issue again, let us know, and we'll do some more testing to see what's going on. 

    Give it a try and let us know how it goes.