CSS code to reduce the vertical spacing between form feilds

  • Profile Image
    Keithy
    Asked on March 28, 2016 at 01:33 AM
    However, I've added more sections to my form and am trying to match the code to tighten the vertical spacing between the other fields but am having serious trouble and can't figure it out! :-/ Can you help me? This is the last piece of the puzzle. So excited to almost be done!!
  • Profile Image
    Chriistian
    Answered on March 28, 2016 at 02:56 AM

    The css code wil be very long as there are a lot of fields that we need to adjust. Allow me some time to investigate the issue further and I will get back to you with the css to reduce the vertical spacing between the form fields.

    Regards.

  • Profile Image
    Chriistian
    Answered on March 28, 2016 at 05:11 AM

    Here's the full code that you can apply to adjust the spacing between the fields. I would suggest deleting the old css and injecting this new css to your form.

    #id_70, #id_71, #id_72, #id_73 , #id_74, #id_75, #id_76, #id_77, #id_109 , #id_110 , #id_111 , #id_112, #id_113

    ,#id_114,#id_115,#id_116,#id_92,#id_93,#id_94,#id_95,#id_96,

    #id_97,#id_98,#id_99,#id_120,#id_121,#id_122,#id_123,#id_124,#id_125,#id_126,#id_127,#id_128,#id_129,#id_130,#id_131,#id_132,#id_133,#id_134,#id_135,#id_136,#id_137,#id_138,#id_139,#id_140,#id_141,#id_142,#id_143,#id_147,#id_148,#id_149,#id_150,#id_151,#id_152,#id_153,#id_154,#id_155,#id_156,#id_157,#id_158,#id_159,#id_160,#id_161,#id_162,#id_163,#id_164,#id_165,#id_166,#id_167,#id_168,#id_169,#id_170,#id_173,#id_174,#id_175,#id_176,#id_177,#id_178,#id_179,#id_180,#id_181,#id_182,#id_183,#id_184,#id_185,#id_186,#id_187,#id_188,#id_190,#id_191,#id_192,#id_193,#id_194,#id_195,#id_196,#id_197,#id_199,#id_200,#id_201,#id_202,#id_203,#id_204,#id_205,#id_206,#id_208,#id_209,#id_210,#id_211,#id_212,#id_213,#id_214,#id_215,#id_220,#id_221,#id_222,#id_223,#id_224,#id_225,#id_226,#id_227,#id_228,#id_229,#id_230,#id_231,#id_232,#id_233,#id_234,#id_235,#id_236,#id_237,#id_238,#id_239,#id_240,#id_241,#id_242,#id_243,#id_244,#id_245,#id_246,#id_247,#id_248,#id_249,#id_250,#id_251{

        margin: 0;

    }

    #id_71, #id_110,#id_93,#id_121,#id_129,#id_137,#id_148,#id_156,#id_164 ,#id_174,#id_182,#id_191,#id_200,#id_209,#id_221,#id_229,#id_237,#id_245{

        position: relative;

        top: -19px;

    }

    #id_72, #id_111,#id_94,#id_122,#id_130,#id_138,#id_149 ,#id_157,#id_165,#id_175,#id_183,#id_192,#id_201,#id_210,#id_222,#id_230,#id_238,#id_246{

        position: relative;

        top: -29px;

    }

     

    #id_73, #id_112,#id_95,#id_123,#id_131,#id_139 ,#id_150,#id_158,#id_166,#id_176,#id_184,#id_193,#id_202,#id_211,#id_223,#id_231,#id_239,#id_247{

        position: relative;

        top: -48px;

    }

    #id_74, #id_113 ,#id_96,#id_124,#id_132,#id_140,#id_151,#id_159,#id_167,#id_177,#id_185,#id_194,#id_203,#id_212,#id_224,#id_232,#id_240,#id_248{

        position: relative;

        top: -66px;

    }

    #id_75, #id_114 ,#id_97,#id_125,#id_133,#id_141,#id_152,#id_160,#id_168,#id_178,#id_186,#id_195,#id_204,#id_213,#id_225,#id_233,#id_241,#id_249{

        position: relative;

        top: -84px;

    }

    #id_76, #id_115 ,#id_98,#id_126 ,#id_134,#id_142,#id_153,#id_161,#id_169,#id_179,#id_187,#id_196,#id_205,#id_214,#id_226,#id_234,#id_242,#id_250{

        position: relative;

        top: -102px;

    }

    #id_77, #id_116,#id_99 ,#id_127,#id_135,#id_143,#id_154,#id_162,#id_170,#id_180,#id_188,#id_197,#id_206,#id_215,#id_227,#id_235,#id_243,#id_251{

        position: relative;

        top: -120px;

    }

    You can check out this cloned form to see it in action: https://form.jotform.com/60871267217963 

    Do let us know if you need further assistance.
    Regards.

  • Profile Image
    Keithy
    Answered on March 28, 2016 at 09:45 AM
    A million thanks!! You all have been so helpful and prompt throughout! Im so appreciative!
    -Keith
    Sent from the lifestream
    ...
  • Profile Image
    Jan
    Answered on March 28, 2016 at 10:57 AM

    On behalf of Christian, you are welcome. We are here to assist you so please let us know if you need any help. Thank you also for your compliments.

  • Profile Image
    Keithy
    Answered on March 30, 2016 at 05:01 PM

    Did I mention how awesome your help has been? Thank you for writing the custom code because I would have never been able to figure that out.Truly impressed with how quick and thorough your responses are. 

    With that being said, just one more question...lol. The space between the inventory rows is perfect, but now there is a big space after the last inventory row and start of new section...is there a way to fix that? If not, no worries as I don't want to break the code, but thought I would ask...

    Thank you again!!

     

     

  • Profile Image
    Chriistian
    Answered on March 30, 2016 at 09:37 PM

    Thank you for your feedback. To better assist you with your latest concern, I have moved your question to a new thread. You can check out that thread by following this link: https://www.jotform.com/answers/806597.

    Regards.