Configurable List widget: Is it possible to number each row automatically?

Is it possible to label each row automatically? Such as 1, 2, 3, and so on?

Hello Carrie,

Thanks for reaching out to Jotform Support. Could you please allow me some time to closely look into this?

Your patience is most appreciated.

Hello Carrie,

Thanks for holding tight. Yes, it is; please inject the following CSS code into your Configurable List widget to number up to 100 lines:

div.configurable-list-field-row-wrapper:nth-child(1) > div:nth-child(1) > div:nth-child(1):before {

   content: "1) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(2) > div:nth-child(1) > div:nth-child(1):before {

   content: "2) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(3) > div:nth-child(1) > div:nth-child(1):before {

   content: "3) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(4) > div:nth-child(1) > div:nth-child(1):before {

   content: "4) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(5) > div:nth-child(1) > div:nth-child(1):before {

   content: "5) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(6) > div:nth-child(1) > div:nth-child(1):before {

   content: "6) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(7) > div:nth-child(1) > div:nth-child(1):before {

   content: "7) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(8) > div:nth-child(1) > div:nth-child(1):before {

   content: "8) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(9) > div:nth-child(1) > div:nth-child(1):before {

   content: "9) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(10) > div:nth-child(1) > div:nth-child(1):before {

   content: "10) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(11) > div:nth-child(1) > div:nth-child(1):before {

   content: "11) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(12) > div:nth-child(1) > div:nth-child(1):before {

   content: "12) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(13) > div:nth-child(1) > div:nth-child(1):before {

   content: "13) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(14) > div:nth-child(1) > div:nth-child(1):before {

   content: "14) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(15) > div:nth-child(1) > div:nth-child(1):before {

   content: "15) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(16) > div:nth-child(1) > div:nth-child(1):before {

   content: "16) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(17) > div:nth-child(1) > div:nth-child(1):before {

   content: "17) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(18) > div:nth-child(1) > div:nth-child(1):before {

   content: "18) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(19) > div:nth-child(1) > div:nth-child(1):before {

   content: "19) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(20) > div:nth-child(1) > div:nth-child(1):before {

   content: "20) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(21) > div:nth-child(1) > div:nth-child(1):before {

   content: "21) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(22) > div:nth-child(1) > div:nth-child(1):before {

   content: "22) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(23) > div:nth-child(1) > div:nth-child(1):before {

   content: "23) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(24) > div:nth-child(1) > div:nth-child(1):before {

   content: "24) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(25) > div:nth-child(1) > div:nth-child(1):before {

   content: "25) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(26) > div:nth-child(1) > div:nth-child(1):before {

   content: "26) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(27) > div:nth-child(1) > div:nth-child(1):before {

   content: "27) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(28) > div:nth-child(1) > div:nth-child(1):before {

   content: "28) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(29) > div:nth-child(1) > div:nth-child(1):before {

   content: "29) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(30) > div:nth-child(1) > div:nth-child(1):before {

   content: "30) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(31) > div:nth-child(1) > div:nth-child(1):before {

   content: "31) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(32) > div:nth-child(1) > div:nth-child(1):before {

   content: "32) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(33) > div:nth-child(1) > div:nth-child(1):before {

   content: "33) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(34) > div:nth-child(1) > div:nth-child(1):before {

   content: "34) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(35) > div:nth-child(1) > div:nth-child(1):before {

   content: "35) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(36) > div:nth-child(1) > div:nth-child(1):before {

   content: "36) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(37) > div:nth-child(1) > div:nth-child(1):before {

   content: "37) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(38) > div:nth-child(1) > div:nth-child(1):before {

   content: "38) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(39) > div:nth-child(1) > div:nth-child(1):before {

   content: "39) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(40) > div:nth-child(1) > div:nth-child(1):before {

   content: "40) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(41) > div:nth-child(1) > div:nth-child(1):before {

   content: "41) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(42) > div:nth-child(1) > div:nth-child(1):before {

   content: "42) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(43) > div:nth-child(1) > div:nth-child(1):before {

   content: "43) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(44) > div:nth-child(1) > div:nth-child(1):before {

   content: "44) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(45) > div:nth-child(1) > div:nth-child(1):before {

   content: "45) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(46) > div:nth-child(1) > div:nth-child(1):before {

   content: "46) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(47) > div:nth-child(1) > div:nth-child(1):before {

   content: "47) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(48) > div:nth-child(1) > div:nth-child(1):before {

   content: "48) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(49) > div:nth-child(1) > div:nth-child(1):before {

   content: "49) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(50) > div:nth-child(1) > div:nth-child(1):before {

   content: "50) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(51) > div:nth-child(1) > div:nth-child(1):before {

   content: "51) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(52) > div:nth-child(1) > div:nth-child(1):before {

   content: "52) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(53) > div:nth-child(1) > div:nth-child(1):before {

   content: "53) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(54) > div:nth-child(1) > div:nth-child(1):before {

   content: "54) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(55) > div:nth-child(1) > div:nth-child(1):before {

   content: "55) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(56) > div:nth-child(1) > div:nth-child(1):before {

   content: "56) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(57) > div:nth-child(1) > div:nth-child(1):before {

   content: "57) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(58) > div:nth-child(1) > div:nth-child(1):before {

   content: "58) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(59) > div:nth-child(1) > div:nth-child(1):before {

   content: "59) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(60) > div:nth-child(1) > div:nth-child(1):before {

   content: "60) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(61) > div:nth-child(1) > div:nth-child(1):before {

   content: "61) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(62) > div:nth-child(1) > div:nth-child(1):before {

   content: "62) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(63) > div:nth-child(1) > div:nth-child(1):before {

   content: "63) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(64) > div:nth-child(1) > div:nth-child(1):before {

   content: "64) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(65) > div:nth-child(1) > div:nth-child(1):before {

   content: "65) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(66) > div:nth-child(1) > div:nth-child(1):before {

   content: "66) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(67) > div:nth-child(1) > div:nth-child(1):before {

   content: "67) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(68) > div:nth-child(1) > div:nth-child(1):before {

   content: "68) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(69) > div:nth-child(1) > div:nth-child(1):before {

   content: "69) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(70) > div:nth-child(1) > div:nth-child(1):before {

   content: "70) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(71) > div:nth-child(1) > div:nth-child(1):before {

   content: "71) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(72) > div:nth-child(1) > div:nth-child(1):before {

   content: "72) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(73) > div:nth-child(1) > div:nth-child(1):before {

   content: "73) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(74) > div:nth-child(1) > div:nth-child(1):before {

   content: "74) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(75) > div:nth-child(1) > div:nth-child(1):before {

   content: "75) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(76) > div:nth-child(1) > div:nth-child(1):before {

   content: "76) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(77) > div:nth-child(1) > div:nth-child(1):before {

   content: "77) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(78) > div:nth-child(1) > div:nth-child(1):before {

   content: "78) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(79) > div:nth-child(1) > div:nth-child(1):before {

   content: "79) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(80) > div:nth-child(1) > div:nth-child(1):before {

   content: "80) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(81) > div:nth-child(1) > div:nth-child(1):before {

   content: "81) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(82) > div:nth-child(1) > div:nth-child(1):before {

   content: "82) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(83) > div:nth-child(1) > div:nth-child(1):before {

   content: "83) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(84) > div:nth-child(1) > div:nth-child(1):before {

   content: "84) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(85) > div:nth-child(1) > div:nth-child(1):before {

   content: "85) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(86) > div:nth-child(1) > div:nth-child(1):before {

   content: "86) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(87) > div:nth-child(1) > div:nth-child(1):before {

   content: "87) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(88) > div:nth-child(1) > div:nth-child(1):before {

   content: "88) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(89) > div:nth-child(1) > div:nth-child(1):before {

   content: "89) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(90) > div:nth-child(1) > div:nth-child(1):before {

   content: "90) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(91) > div:nth-child(1) > div:nth-child(1):before {

   content: "91) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(92) > div:nth-child(1) > div:nth-child(1):before {

   content: "92) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(93) > div:nth-child(1) > div:nth-child(1):before {

   content: "93) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(94) > div:nth-child(1) > div:nth-child(1):before {

   content: "94) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(95) > div:nth-child(1) > div:nth-child(1):before {

   content: "95) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(96) > div:nth-child(1) > div:nth-child(1):before {

   content: "96) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(97) > div:nth-child(1) > div:nth-child(1):before {

   content: "97) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(98) > div:nth-child(1) > div:nth-child(1):before {

   content: "98) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(99) > div:nth-child(1) > div:nth-child(1):before {

   content: "99) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

div.configurable-list-field-row-wrapper:nth-child(100) > div:nth-child(1) > div:nth-child(1):before {

   content: "100) " !important;width: 4% !important;margin-bottom: 5px !important;font-size: 20px !important;font-weight: bold !important;}

Result:

Related guide: How-to-inject-css-codes-to-widgets

Let us know if there’s anything else we can help you with.