Help with input table columns

  • Profile Image
    justinnubla
    Asked on March 14, 2018 at 08:58 PM

    Hi. I'm trying to adjust the width of the columns in the input table. However, it seems that trying to input whatever values for column width in the question settings does nothing. Any help?


    1521075465Input table problems.png

  • Profile Image
    justinnubla
    Answered on March 14, 2018 at 09:13 PM

    I managed to solve the problem by using CSS codes. Now, my current dilemma is that this works fine in desktop but in mobile it looks hideous. any solutions for this?

    1521076376Input table.png

  • Profile Image
    tina
    Answered on March 15, 2018 at 04:46 AM

    Sorry for the inconvenience caused to you.

    Could you please clear the previous custom CSS codes and paste the following CSS codes instead of the previous one:

    .form-matrix-column-headers

    {

    height: 40px;

    width:70px!important;

    }

     

    .form-matrix-row-headers {

        width:700px!important;

    }

     

    .form-matrix-row-headers, .form-matrix-column-headers {

        font-size: 12px;

    }

     

    @media screen and (max-width: 800px) { 

    table tr:nth-child(1) th{

      width:18%!important;

      height:60px!important;

    }

     

    table tr th,

    table tr td{

      width: 18% !important;

      word-wrap: break-word;

      display: inline-table

    }

     

    table tr th:nth-child(1){

      width: 89%!important;

      display: block!important;;

      word-wrap: normal!important;;

       word-break: 

      /*! transform: rotate(-90deg); */

      /*! width: 224px !important; */

    .form-matrix-table tr{

      background-color:transparent!important;

    }

    }

    How to Inject Custom CSS Codes

    This is the result you should see on mobile devices:

    1521103419Screen Shot 2018-03-15 at 11.4

    You can check the demo form and clone it if you need to:

    https://www.jotform.com/80732191523957

    How to Clone an Existing Form from a URL

    I hope this helps.