Need help aligning the form widget's inner fields

  • mgregov
    Asked on April 25, 2016 at 8:36 AM

    Hello I am currently working on the following form

    https://www.jotform.com/?formID=61105687817158#

     

    On Page 4: I have entered some custom codes you had given me but they didn't work for all the text boxes.

    I am looking to right justify (like the first set of text boxes) the text box label and then line up all the text boxes going down in the row.

    The code given to me only made the change to the first one.

     

    Please help.

    Thank you

  • Ben
    Replied on April 25, 2016 at 9:47 AM

    I see that this is related to the other thread where I had replied here: https://www.jotform.com/answers/824446#824454

    Please do note that as mentioned there, you will need to copy paste the CSS to all of the widgets that you wish to have the same alignment set to.

    Since my colleague had logged into your account and made modification to a single widget, it is the reason why the rest did not have the same code applied to it.

    On the following screen cap you can see how to add it to as many as you wish:

    Need help aligning the form widgets inner fields Image 1 Screenshot 20

    - If you do not see the image in your email, you will need to come to the thread itself instead. This is the thread: https://www.jotform.com/answers/825711

     

  • mgregov
    Replied on April 25, 2016 at 10:44 AM
    again, you are talking about the wrong page.
    I am inquiring about page 4: Where the page begins with Assets:
    The below thread is about the wrong page.
    Very frustrating.
    ...
  • mgregov
    Replied on April 25, 2016 at 10:44 AM
    Ok...I was able to get help from someone.
    The code given was entered, but for page 6 it does not line up correctly (the text boxes).
    Can someone help me with that?
    ...
  • Ben
    Replied on April 25, 2016 at 12:23 PM

    If you add the following CSS code to your form, it will resolve the issue:

    #id_113, #id_124, #id_126 {
        width: 260px;
    }

    This happens because the text fields are not of the same width, and as such the fields behind the same got placed differently. The above makes them of the same width and will now work right.

    You can add it to your form by following these steps: Inject Custom CSS Codes