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 do I decrease spacing between widget items?

    Asked by fhpw on May 05, 2016 at 06:53 AM

    I have successfully created a block of Inventory Widget Items. I decreased the padding with the following CSS fro two blocks of widget items:

     

    #id_85,#id_86,#id_87,#id_88,#id_89 {
        padding-top : 0px !important;
        padding-bottom : 0px !important;
        margin-top : -20px !important;
        margin-bottom : 0px !important;
    }

    #id_90,#id_91,#id_92,#id_93 {
        padding-top : 0px !important;
        padding-bottom : 0px !important;
        margin-top : -20px !important;
        margin-bottom : 0px !important;
    }

    https://form.jotform.com/61236614962962

    In design mode it the widget items are flushed, but when previewing the widgets items are spaced apart.

     

     

    Design mode

     

    Preview/Browser view

    I tried three different browsers with all the same results. What am I missing? 

     

    Thanks,

     

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

    items decrease how how do i
  • Profile Image
    JotForm Support

    Answered by Boris on May 05, 2016 at 08:54 AM

    There seems to be a small error in your CSS codes, which was preventing your custom CSS from being applied. In the Designer, this is the erroneous code I see at line 49:

    .form-textbox {
        #input_23{width : 100px;
        width : 122px;
    }

    Please remove the entire line marked in red, meaning you should remove #input_23{width : 100px;, and your custom CSS should be applied correctly after that:

    If you need further assistance, please let us know.

  • Profile Image

    Answered by fhpw on May 05, 2016 at 09:28 AM

    Thanks!  I just discovered it and was going to reply. It worked.