How to span the images into two columns.

I had to change the page 1 layout.

Again I need the shirt image to span two column toward the right.

Hi Pam,

Thanks for reaching out to Jotform Support. To adjust the fields into two columns towards the right alignment, here's how:

1. In Form Builder, click the Paint roller icon from the upper-right.

2. In Form Designer, go to Advanced Designer at the bottom-left of the panel.

3. In your Advanced Form Designer, go to Form Layout from the left navigation.

4. Enable Form Columns, and adjust the Number of Columns to your desire.

5. Next, go to Label Styles.

6. In your Label Style, select the Right Alignment.

7. Next, click the Disc icon from the upper-left corner to Save the changes.

8. Then click the Jotform Logo next to the Disc icon to go back to your Form Builder.

Note, any changes from the Advanced Form Designer will not be saved if the Disc icon is not selected before going back to Form Builder. You can insert another field next to your Image fields to write your product description. See the screenshot below for my results:

Reach out again if you have any other questions.

I need to retain 3 column layout on page 3, that's why I wanted to adjust just the image on page 1.

Hi Pam,

Can you try to inject the custom CSS codes below into your form and adjust values if needed?

/* Wrap hat and shirt in a flex row */

#id_213, #id_214 {

    float: none !important;            /* Remove default float columns */

    display: inline-block !important;  /* Allow them to sit side by side */

    vertical-align: top;

    margin: 0 !important;

    padding: 0 10px !important;

}

/* Hat smaller */

#id_213 {

    width: 30% !important;

}

/* Shirt bigger */

#id_214 {

    width: 50% !important;

}

/*move shirt to the right*/

#id_214 {

  position: relative;

  left: 40px !important

}

Here's how it looks after injecting the custom CSS codes:

Give it a try and let us know if you need any more help.

Thanks, worked great!