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 can I can create more than 1 column in "Purchase Order" (I have over 100 products) and isn`t practical for the buyer ...?

    Asked by decodesign on July 18, 2011 at 11:23 AM

    I have over 100 items for sale. I'm starting to use "Payment Order" and need to know how to create multiple columns in the form ("Purchase Order") , because with a single column the buyer makes a huge tour to select all products to buy. Thank you.

     

    Example

     

    MC001

     

    mx 122

     

    MC002

     

    mx 227

     

    ....

     

    MC002    MC001

     

    mx 122   mx 227

    Page URL:
    https://sites.google.com/site/wwwdecodesigncomuy/home/comprar-consulta<br/>s

  • Profile Image
    JotForm Founder

    Answered by aytekin on July 18, 2011 at 11:25 AM

    Unfortunately, we do not have an option to have multiple column. What you can do is to copy full form source code to your web site, open it in your favorite HTML editor and add columns as you wish.

    Here is how you can get full form source code. Open your form on the Form Builder:
    1. Open "Setup & Embed" tab on toolbar,
    2. Click on "Embed Code"
    3. Click on "Source" button and copy it to your web site.

  • Profile Image

    Answered by decodesign on July 18, 2011 at 11:32 AM

    Thanks for your quick answer. Im going to try on that way. Thanks!

  • Profile Image

    Answered by decodesign on July 18, 2011 at 11:58 AM

    Sorry, but i don`t know almost nothing about this. I`m trying to start selling by internet and i`m using google picassa,google sites, google docs and now jotform. At the moment I`m going well because i don´t need network knowledge,etc. Please tell me in red  what i have to add in the httml editor below to have 4 columns. Thank you very much!!!!!

    ______________________________________________________________________________________ 

    <img src="https://www.google.com/chart?chc=sites&amp;cht=d&amp;chdp=sites&amp;chl=%5B%5BGoogle+Gadget'%3D16'f%5Cbf%5Chv'a%5C%3D248'0'%3D247'0'dim'%5Cbox1'b%5CDBD9BB'fC%5CDBD9BB'eC%5C15'sk'%5C%5B%22Jotform%22'%5Dh'a%5CV%5C%3D12'f%5Cbf%5C%5DV%5Cta%5C%3D249'%3D0'%3D248'%3D1996'dim'%5C%3D249'%3D0'%3D248'%3D1996'vdim'%5Cbox1'b%5Cva%5CFFFEF0'fC%5CDBD9BB'eC%5Csites_gadget'i%5Chv-0-0'a%5C%5Do%5CLauto'f%5C&amp;sig=1H94A46WIBotgC27HecBT131XmI" igsrc="//33.gmodules.com/ig/ifr?mid=33&amp;synd=trogedit&amp;url=http%3A%2F%2Fhosting.gmodules.com%2Fig%2Fgadgets%2Ffile%2F102235888454881850738%2Fjotform.xml&amp;up_form_id=11981039153&amp;h=1999&amp;w=100%25" type="ggs-gadget" props="align:center;borderTitle:COMPRAR  &amp; CONSULTAS;height:1999;igsrc:http#58//33.gmodules.com/ig/ifr?mid=33&amp;synd=trogedit&amp;url=http%3A%2F%2Fhosting.gmodules.com%2Fig%2Fgadgets%2Ffile%2F102235888454881850738%2Fjotform.xml&amp;up_form_id=11981039153&amp;h=1999&amp;w=100%25;mid:33;scrolling:auto;showBorder:false;showBorderTitle:null;spec:http#58//hosting.gmodules.com/ig/gadgets/file/102235888454881850738/jotform.xml;up_form_id:11981039153;width:100%;wrap:false;" width="500" height="1999" style="display:block;margin:5px auto;text-align:center;" class="igm">

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

    <div style="text-align:center"><br>

    </div>

  • Profile Image
    JotForm Support

    Answered by NeilVicente on July 20, 2011 at 12:33 PM

    Hi,

    The solution offered by Aytekin should work only on sites which are hosted on your own web hosting account or on a host that permits all kinds of html codes.

    Unfortunately, Google Sites is a little bit on the restrictive side, and inserting the full source code in the site will give you this error message:

     

    It is most probably the script tags that were not permitted and thus removed from the page. Without those tags, the form will not work and will be considered useless.

    As such, I advise that you stick with the usual way for embedding your form in Google Sites. Or, you can probably get a hosting account to have your site hosted and the customized form embedded on.

    Hope I was able to shed some light into this issue. Let me know if there's anything else you require assistance with. Thank you for using Jotform!


    Neil

  • Profile Image

    Answered by cdroblyn on March 24, 2012 at 01:02 PM

    Would be a great add to the next revision.  as well, I would like to also add the ability to add multiple product areas with a "grand total" feature of multiple product areas.  Makes jotform which is great even more robust.

  • Profile Image

    Answered by tampopo on May 12, 2012 at 08:24 PM

    I second the request to be able to add columns or different sections that add up to a grand total. I'm trying to create an online menu and will have the same problem of people having to scroll and scroll to be able to make even just a few choices. I tried adding a form collapse to separate sections but was not able to add the paypal tool a second time. If I would upgrade to the paid subscription, would I be able to add the paypal tool to different sections - or am i just then able to offer paypal as well as credit card as a payment option?

     

    Thanks! Love this service and site!!

  • Profile Image

    Answered by cdroblyn on May 12, 2012 at 11:11 PM

    I have a paid version and still cannot do it.  currently, i just embed the source code then edit the code.  I just use the <table> tags and insert columns.  problem is, i have a "required area" that is validated requiring payment while the other area isn't required. It would be better for jotform to have a "grand total" area.  I used a place some time ago called "www.elbowspace.com"  they could do it.  it worked for me for a couple of years but the overall quality and limitations forced me to look elsewhere.  I was spending too much time editing the code to make it do what I wanted it to do.

  • Profile Image
    JotForm Support

    Answered by jonathan on May 13, 2012 at 06:25 AM

    @cdroblyn,

    Hi, Can you provide us more details on what you meant by "required area" in the payment tools?
    We surely want to know how this can be integrated on the current payment tools if applicable. 

    I did try checking the Purchase Order payment tool and double check if there is a part that can isolate a product from "required" and "not required" -- but I could not find it. From what it is now, you can only choose(check) or not choose a product and it will affect the one grand total field.

    I also tried creating a very simple sample on how I can create a multiple-column Purchase Order form using the source embed method. And I think it is very doable -- I can place the different products on the page and still compute each values into 1 "grand total". 

    The page looks like the screen below. There are 3 columns, and I made product #2 free , so it does not add to the total. 

    You can further check the sample page here.

    If you are interested to use this or need assistance in coming up with a similar form, please inform us. May I also request though that you instead create a separate post here https://www.jotform.com/answers/answer.php? to further assist you better.

    Thanks.

     

  • Profile Image

    Answered by forkeo on February 11, 2013 at 09:37 PM

    I would like to know how you did multiple columns!

  • Profile Image

    Answered by cdroblyn on February 11, 2013 at 11:17 PM

    http://www.yahisone.com/test/index.php (this will open in a new window).

    Have a look at a registration form I made last year for a function.  Pay attention to the columns made in the t-shirt and camping types.  Changing the label class "form-sub-label" to read "" forces the Qty to be on the same line as the product. You can use standard html to "style" QTY if you wanted to. I was happy with the default.  You can right click on the page and select "view source" to see the code.  Look for line 281 this is where it starts.  Hope this helps.  BTW, spend some time at W3schools.  they help alot.  heres a link to some great info to help solve your delimma.  http://www.w3schools.com/html/html_tables.asp (this will open in a new window).

  • Profile Image
    JotForm Support

    Answered by Welvin on February 12, 2013 at 05:26 AM

    Hi,

    You can also inject custom CSS codes to align product list in two columns.

    This codes:

    .form-product-item {

    border: 1px solid #EFEFEF;

    margin: 1px;

    float: center;

    width: 293px;

    }

    .form-product-item + br {

    display:none;

    }

    br + b {

    float: left;

    padding-top: 20px;

    }

    You will need to adjust the width value, sometimes, this codes will depend on your theme style.

    Guide: How to Inject Custom CSS Codes

    Example Form: http://www.jotformpro.com/form/30422140372944

     

    Let us know if you need anything else.

    Thanks

  • Profile Image
    JotForm Support

    Answered by Welvin on February 12, 2013 at 05:31 AM

    Also, adjusting the Width to smaller value will create two or more columns. Cheers!