-
ToniaJensenAsked on November 1, 2016 at 11:55 PM
I have created a Matrix in my form and I need to duplicate that Matrix several times in the same Form (session 1, session 2, etc) but when I duplicate the Matrix, the sizes of the columns are changing. I tried to adjust the CSS codes, but it's all the same.
-
CharlieReplied on November 2, 2016 at 6:19 AM
May I know what you are trying to adjust? If you could provide us more details of what you would like it to look like, that will help us to better assist you.
Currently, this is how your matrix fields looks like:
Please note that the CSS code that you currently have only applies to one matrix field, your CSS code is using IDs, so it is not applicable to other matrices. You need to get the specific IDs or Class names of the other matrices if you want to style them.
For example, if you want to make all the text box inside the matrix field to have the same length, then this CSS code will work:
table.form-matrix-table > tbody > tr > td > input {
width: 70px !important;
}
It simply states that make all the input text box of matrix fields to width of 70px. Here's how it looks like when applied on a cloned form: https://form.jotform.com/63062161894962
Let us know if that helps.
-
ToniaJensenReplied on November 3, 2016 at 12:44 AMDear Charlie,
I would like to adjust each text boxes inside of the Matrix to different
size. The first box a little bit bigger and the other 2 a little smaller.
How to do that?
Best regards,
Ann
... -
candyReplied on November 3, 2016 at 7:19 AM
Hello Ann,
I've cloned your form in order to test it on my side. I've injected the following CSS codes into the form:
.form-matrix-column_0{
width:300px !important;
}
.form-matrix-column_1{
width:30px !important;
}
.form-matrix-column_2{
width:30px !important;
}
And then, I have got the matrix as you can see the following screenshot:
You can change the width of the fields above as you have wanted.
Please check again, if you need further assistance do not hesitate to contact us.
Thanks in advance.