How can I move the header closer to the copy?

  • hiltonelconquistador
    Asked on October 17, 2016 at 1:51 PM

    Am new to using the program, and need to know how to make this page look better by moving the header closer to the form. Please help. Thanks!

    Jotform Thread 963142 Screenshot
  • eceblngn
    Replied on October 17, 2016 at 2:18 PM

    Hi, 

     

    The blank space may have been caused by the height of the form headers. In that case, you can solve this problem by following the steps below.

    First click on Setup&Embed segment, then click on the Design button. Double click on the header area where the picture is on. On the right hand side of the page there is a "Vertical Padding" option that helps to shrink the height. 

    If this doesn't work, you can inject CSS codes.

    Here is a guide showing how to do it: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    You can inject these codes:

     

    .form-header {

        padding-top: 100px !important; 

        padding-bottom: 100px !important;

    To reduce the space in the header you can alter the numbers in the above codes.

     

     

    I hope it helps. 

  • David JotForm Support
    Replied on October 17, 2016 at 3:03 PM

    I checked your form and did not see an image currently.  The process to adjust the spacing described above should be correct for headers, however, if you would like to change only a single headers' spacing, we can help with that as well.  Let us know when the image is added back to the form if the spacing still needs to be adjusted and we will be happy to have another look.