How do I set margins on all pages of a form to be the same?

  • TheIIC
    Asked on December 26, 2016 at 11:12 PM

    I have an application form.

    I want to set the margins on all pages to be about .75 to 1 inch. I can get the instructions page to be set at this but cannot get the balance of the form to be at the above, both when I display the form on screen and print out the form using the Print button. I assume I should set the padding to be 0, if I want the margin to be exact. I wrote the code for the Instructions Section but cannot set the balance of the form. Do I need to do this for each section? If yes, how do I know which section I am in with the inject CSS?

    Also, when I print the instructions page (first two pages) the font is small and hard to read. I would like it to be at least a 11 or 12 font but it looks like it is about 8.

    Any assistance would be appreciated.

  • Özlem JotForm Developer
    Replied on December 27, 2016 at 1:36 AM

    Hi,

    Let me clarify your issue and how to inject custom CSS to your form in Advanced Designer.

    - Do I need to do this for each section? If yes, how do I know which section I am in with the inject CSS?

    Advanced Designer provides to select any of your form field and inject the CSS for this form field uniquely. You can also select more than one field and inject the same CSS for that.

    Please have a look at the following guide:

    #1- Click Design.

    #2- Click Advanced Designer in the Design page.

    How do I set margins on all pages of a form to be the same? Image 1 Screenshot 50

    #3- In the coming page, please click CSS tab.How do I set margins on all pages of a form to be the same? Image 2 Screenshot 61

     

    After that, you can change the style of all of form fields in your form. If you want to change a form field style uniquely as I mentioned before, you can do that by double-click to this form field.

    If you want to style multiple form fields, for example all TextBoxes, you need to make only one click.

    Please have a look at the following video.

    How do I set margins on all pages of a form to be the same? Image 3 Screenshot 72

    #1- .form-line is common field ID for all form fields and when I give it a margin with CSS, it changes all form fields' position in the form. I made one-click to the one of form field.

    #2- You can also see the form field name when you hover the form.

    #3- Finally, I double-clicked the Certifications (5 pts.) form field and change the margin again. Only this form field effected from this change.

    Please after you finished to change style in Advanced Designer, please click the bottom at the left side of the form "Save Changes".

    How do I set margins on all pages of a form to be the same? Image 4 Screenshot 83

     

    You are also using Form Tabs Widget to separate your form into pages. However, you can see these pages only in the preview, not form builder. That's why, when you style your form in form builder, all of your pages in the preview will be the same in the form builder version.

    Please have a look at the following guides if you need more details.

    How-to-Inject-Custom-CSS-Codes

    If it is not the issue, please provide more details and add some screenshots about your request.

    How-to-add-screenshots-images-to-questions-in-support-forum 

     

    If you need any further assistance, please feel free to let us know.

    Thank you.