What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How can I set alignment on image checkboxes?

    Asked by schenkco on February 10, 2016 at 01:07 PM

    Hi, for some reason the alignment (or padding) for my image checkboxes is set so it's starting at 2/3 of the page. How do I remove the extra space on the left? Thanks!

    Page URL:
    https://form.jotform.com/60405092105241

    checkboxes alignment image checkboxes
  • Profile Image
    JotForm Support

    Answered by Kevin_G on February 10, 2016 at 02:33 PM

    Paste this CSS code in the CSS tab, just open the wizard of your widget and you will find it on the right side:

    li {

        margin-left: 28px;

    }

    Hope this helps.

  • Profile Image

    Answered by schenkco on February 10, 2016 at 03:37 PM

    Hi Kevin,
    My apologies-perhaps my explanation was misleading. I thought it was the image checkboxes causing the alignment issue but I think it's affecting my entire form. Is there a way to set the whole form to be left justified? For instance, on our website the form is showing up 2/3 of the page but ideally I would like everything left aligned. I find there is too much padding on the left and on the top. Please see screenshot attached (blue outline is where I would like the form to be).

  • Profile Image
    JotForm Support

    Answered by Kevin_G on February 10, 2016 at 04:51 PM

    You may try injecting this CSS code in your form, then re-embed it again:

    .form-all{

     padding:0px;

    margin:0px;

    }

    If it does not reduce the space, please provide us the URL where you have embedded your form, it will help us to make tests and provide you the exact code to align properly your form.

  • Profile Image

    Answered by schenkco on February 10, 2016 at 06:07 PM

    Awesome, we're so close! It's left aligned but I'm wondering if we can tighten up the gap on the top. Looks like there's still 10-20px padding.

    https://form.jotform.com/60406601077246

     

    Thanks!

  • Profile Image
    JotForm Support

    Answered by Chriistian on February 11, 2016 at 12:35 AM

    You can inject the following css code to your form.

    .jotform-form {

        padding: 0px!important;

    }

    .form-line {

        padding: 0px 36px!important;

    }

    Here's a guide on how to inject css: How to Inject Custom CSS Codes

    You can also follow this link to see the cloned form where I tested the css: https://form.jotform.com/60410435966960

    If you want to clone it to your account, you can follow this guide: How to Clone an Existing Form from a URL

    Let us know if you need further assistance.

  • Profile Image

    Answered by schenkco on February 11, 2016 at 10:07 AM

    Good stuff, it works! Thank you!