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

    Aligning graphics and pics in form

    Asked by minemetitiri on January 21, 2016 at 03:52 PM

    Hi,

     

    I want to center my logos on my form. Nothing I have tried works.

     

    I made my form wider but now I can't center my logos. 

    How can I do that. 

     

     

    Page URL:
    https://form.jotform.com/60038432878157

    and in wider how can't how can i
  • Profile Image
    JotForm Support

    Answered by Chriistian on January 21, 2016 at 09:22 PM

    Hi,

     

    You can inject this code to align the logos to the center:

    li#id_23 {

    margin-left: 70px;

    }

    li#id_22{

    padding-left: 0px!important;

    }

    li#id_21 {

    padding-right: 22px;

    }

    @media screen and (max-width: 480px){

      li#id_23 {

        margin-left:0px!important;

     }

    }

    Here's how you can inject css: How to Inject Custom CSS Codes

     

     

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

  • Profile Image

    Answered by minemetitiri on January 26, 2016 at 11:35 AM

    Hi,

    I made a change to one of the logos and noticed the alignment also changed. I injected to code above but it is now not working. I tried to modify the code within the injector box, but that did not help to make the adjustment I needed. Help, please.

     

    https://form.jotform.com/60038432878157

  • Profile Image

    Answered by victor on January 26, 2016 at 02:47 PM

    After reviewing your form I noticed an error in your CSS code

    the field #input_36 is used correctly. The fields has a starting { but does not have an ending. I also noticed that the CSS code provided was not inserted. Can you please remove this tag and add the provided CSS, by my colleague.

    Please let us know if this helps.

  • Profile Image

    Answered by minemetitiri on January 27, 2016 at 04:47 PM

    Hello, I removed the tag, and injected the code. The logos are still not centered. I need them to move right a little bit more. Where in the code can I address this? Am I just tweaking each photo individually in the code?

  • Profile Image

    Answered by victor on January 27, 2016 at 06:10 PM

    To adjust the image to the right or left you just need to change the margin-left attribute of the li#id_23 field

    li#id_23 {

    margin-left: 70px; /*you can increase to move right or decrease it to move it left*/

    }

    li#id_22{

    padding-left: 0px!important;

    }

    li#id_21 {

    padding-right: 22px;

    }

    @media screen and (max-width: 480px){

      li#id_23 {

        margin-left:0px!important;

     }

    }

    Please let us know if you require additional assistance.