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 to customize the CSS code of a form, in order to adapt it to a background image and customize the look of the page break buttons.

    Asked by leadPops28 on October 27, 2014 at 07:29 PM

    Ive been able to figure out how to use a background image with a form, but i haven't been able to figure out how to move the questions down. I was able to "inspect element" on my browser to find how to do it, but then when I got the source code I couldn't find the <div class="form-all" where I was able to move it.

    How can I move the questions down?

    Also I would like to create a custom button within that background image, but don't know where to do that.

     

    In the image attached, I'm trying to have the questions inside the image, and then customize a button that would look like in the example.

    Any help would be appreciated

    thank you

    Page URL:
    http://form.jotform.us/form/42664167199163

    Screenshot
    background image and style size source name
  • Profile Image

    Answered by raul on October 27, 2014 at 08:04 PM

    Hello,

    In order to change the styles of a form you can inject custom CSS code. Please refer to this guide: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes-to-your-Form

    For example, in order to move the text down in your form, please try to inject the following CSS code:

    .form-section { margin-top: 50px; }

    Regarding the Go Button, could you please explain a little bit more how do you want it to make it look? This information will help us to provide the exact CSS code that you need to use.

    We will await for your response.
    Thanks.