How do I decrease spacing between widget items?

  • Profile Image
    fhpw
    Asked 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,

     

  • Profile Image
    Boris
    Answered 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
    fhpw
    Answered on May 05, 2016 at 09:28 AM

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