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

    Can I expand the size of the matrix without getting into HTML coding?

    Asked by Jmullen on April 25, 2014 at 12:41 PM

    Please see the attached screenshot of a portion of my form.  The top part of the screenshot is a graphic.  The bottom part is the actual matrix.

     

    I would like to expand the size of the matrix to match the size of the top part.

     

    Thanks in advance for any help you can offer.  I'm not an HTML programmer, but if that is what is needed, I'll find someone wit those skills.  And THANKS for JotForm ... G R E A T product!!

     

    Page URL:
    http://form.jotform.us/form/40991031365149

    Screenshot
    size expand JotForm product
  • Profile Image
    JotForm Support

    Answered by TitusN on April 25, 2014 at 02:41 PM

    Hello,

    Thank you for the kind words.

    You may not need a programmer for this:

    You need to inject CSS code to your form to adjust the matrix width.

    To do that - please use this guide

    Here is the CSS that you will inject in your form to adjust the matrix width - just copy it and paste it as directed in the guide above:

    /*Force the matrix to adjust to the width of the image*/

    .form-matrix-table {
    width: 517px!important;
    }

    /*Correct the Row Header Width*/

    .form-matrix-row-headers, .form-matrix-column-headers {
    width: 35px;
    }
    /*Correct the matrix input box row*/

    input.form-textbox {
    width: 85%;
    }


    Let us know if this helps

  • Profile Image
    JotForm Designer

    Answered by omer on April 25, 2014 at 02:46 PM

    Hi Jmullen, 

    You can do that injecting some CSS, so you don't need to get into HTML.

    You can open the "inject css area" following "Setup & Embed" -> "Preferences" -> "Form Styles" -> "Inject Custom CSS". Please paste this code below into area.

    .form-matrix-table { width: 571px; }

    .form-matrix-row-headers { width: 5%; }

    .form-matrix-values { width: 19%; }

  • Profile Image

    Answered by Lauren  on December 29, 2014 at 03:49 AM

    Thanks For Your Help ,

    i was Looking for Something Like this
    I Just Implemented This Design Forms On my website ,Save my Day :)
    http://buylikesandviews.com/

    Great help , Looking G8

    Cheers

  • Profile Image
    JotForm Support

    Answered by abajan on December 29, 2014 at 08:27 AM

    On behalf of my fellow JotForm team members, you're most welcome!

    Cheers