-
SumSolTrainAsked on July 1, 2014 at 3:52 AM
Hi
We need to format a specific matrix tables textboxes width. We have tried the following options but they have not resulted in any changes.
#cid_21 #form-matrix-column_1 .form-textbox {width:200px;}
#cid_21 .form-matrix-row-headers +.form-matrix-values +.form-matrix-values .form-textbox {
width:200px;
}
#cid_21 .form-matrix-row-headers +.form-matrix-values +.form-matrix-values .form-textbox
{width: 200px;}
#cid_21 #form-matrix-column_1 .form-textbox {
width:200px;}
Please see below for an example of the table.
Please advise on what we need to do.
Thanks so much.
Kind Regards
--------------------------------------------------------------------------------------------
http://pastiebin.com/53b274f135c3d
-
Welvin Support Team LeadReplied on July 1, 2014 at 5:21 AM
What is the form URL? You have to target the main ID, in that case, you should use the following:
For First Column:
#id_21 .form-matrix-row-headers + .form-matrix-values .form-textbox {
width: 200px !important;
}
For the Second Column:
#id_21 .form-matrix-row-headers + .form-matrix-values + .form-matrix-values .form-textbox {
width: 200px !important;
}
If you need to apply it to the 3rd, 4th and so on, just add three (3) .form-matrix-values to adjust the 3rd column.
Let us know if you need any further assistance.
Thanks
-
Welvin Support Team LeadReplied on July 1, 2014 at 5:23 AM
Here's an example form with custom widths for each column for a specific matrix table: http://www.jotformpro.com/form/41812452898968
Thanks
-
SumSolTrainReplied on July 2, 2014 at 4:04 AM
Hi thanks for the reply
I injected the Code and it works for the 2nd 3rd and the 4rth column and it does not working while i put for the first column like this:
#id_21 .form-matrix-row-headers + .form-matrix-values + .form-textbox {
width: 20px !important;
}
form url : http://www.jotform.com//?formID=41773621486561
-
Elton Support Team LeadReplied on July 2, 2014 at 7:51 AM
@swapna_summit
There's a plus sign (+) before the .form-textbox class on your code. Removing it should fix the problem.
Here's the corrected code:
#id_21 .form-matrix-row-headers + .form-matrix-values .form-textbox {
width: 20px !important;
}
Regards!
-
SumSolTrainReplied on July 2, 2014 at 7:56 AM
Hi could you please write the coding that should affect all the matrix cell width to 23px for a numeric text box in matrix
-
Elton Support Team LeadReplied on July 2, 2014 at 9:13 AM
Here's the code for that.
.form-matrix-values .form-number-input {
width: 23px !important;
}
Cheers!
-
rebekah405Replied on April 8, 2015 at 2:38 PM
I also need to format a specific matrix tables textboxes' width but I can't figure out what css code I should use. I tried following the steps above but I'm not sure how to locate the main id and how to customize.
Here is the form link: http://form.jotform.us/form/50963867216161
and here is a shot of what the matrix curently looks like, I want the fillable text box width much wider. Can we make it show the entire data that is entered (it can get lengthy)?
-
David JotForm SupportReplied on April 8, 2015 at 4:44 PM
Hi,
I have moved your request to a thread of its own so that we may address it properly. We will follow up with our response here: