How can I make the submit button be to the right of the label?

  • Profile Image
    elegantees5
    Asked on August 18, 2011 at 11:54 AM

    I like this example. How can I get the submit button to be in the same 'row' as the email label?

  • Profile Image
    NeilVicente
    Answered on August 18, 2011 at 12:45 PM

    Hi,

    To implement the same style to your form:

    Shrink both the e-mail field and the submit button. Right-click then choose Shrink.

    Inject this css code to hide the label for the E-mail field

    .form-label-left {
    display:none;
    }

    To inject custom css:

    1.  Go to Setup & Embed tab
    2.  Click Preferences Form button
    3.  Choose Form Styles tab
    4.  Copy and paste the css code in the Inject Custom CSS textarea

    The finished product should look like this form:

    https://www.jotform.com/form/12293643575

    We hope you find this answer helpful. Thank you for using JotForm!


    Neil

  • Profile Image
    elegantees5
    Answered on August 19, 2011 at 04:07 AM

    Great reply!! This worked perfectly :)

  • Profile Image
    copening
    Answered on August 30, 2011 at 03:22 PM

    Odd... I tried it... like 10 times and it didn't work for me. 

  • Profile Image
    allanftd
    Answered on August 30, 2011 at 03:30 PM

    @copening,

    May we ask which of your forms you would like to modify using this technique?

    JOTFORM SUPPORT

  • Profile Image
    copening
    Answered on August 30, 2011 at 04:22 PM

    Used another CSS code and got it fairly close... you can see it here...

    http://www.connectionsgroups.com/moontide.html

    the form is labeled - Moontide News

  • Profile Image
    brx250
    Answered on August 30, 2011 at 11:28 PM

    Hi copening,

    Thank you for using JotForm.

    I've tried checking your form and I've noticed its width to be a little narrow and the CSS you need is not just the one mentioned above. Try replacing your CSS with this code below 

     

    .form-buttons-wrapper {

    margin-left:-21px !important;

    padding-top:22px;

    padding-left:3px;

    }

    I've also attached here a link of the form I cloned from you. If you want, you can clone it too. http://www.jotform.com/form/12411438846 (Here, I've altered the form's width and CSS)

    Hope this helps.

    If you have further issues and concerns, please feel free to contact us again.

    _____________________________________________  
    Albert  JotForm Support