Two column payment form

Good Afternoon,

I hope that you can help me with a question on creating a form with 2 "product" columns.  I have created a form that is single column that works fine for a listing of items that can be ordered.  However, it involves a fair amount of scrolling to be able to submit the order.  So what I would like to have is two columns of productrs, cutting the scrolling in half.

So I copied the original form and increased the width of the form (https://form.jotform.com/80457260853156) to have room for the two columns.  I shrank the field (Inappropriate Grandpa Products) and enabled the Move to new line option.  The item now takes less than half the width of the form.  However, If I create a new item/product, I can not get it to be on the same line as the first item, even if all items are "Shrunk".

Any thoughts on what I'm missing here ?  Any help appreciated

Please check my cloned form: https://form.jotform.com/80498227824970

Is that what you're trying to achieve? If yes, you can clone the form by following the guide below to check the custom CSS code I have added. 

https://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL

You can also just copy the custom CSS code and add it to your form:

.form-product-item {

border: 1px solid #EFEFEF;

margin: 1px;

float: center;

width: 350px;

}

.form-product-item + br {

display:none;

}

br + b {

float: left;

padding-top: 20px;

}

.form-payment-total {

line-height: 50px;

margin: 1px;

border: 0px solid #EFEFEF;

border-radius: 4px;

padding: 15px;

padding-right: 193px;

padding-left: 6px;

}

Let us know if you need further assistance. Thank you.

You are brilliant !!!!!!!!
That is exactly what I was hoping for, clearly I wasn't searching for the correct terminology.
Thank you very much, that was beyond easy to implement
Scott Williams
...