-
ohsucmeAsked on June 12, 2018 at 3:31 PM
A while back I asked for some help with the configurable lists on this form: https://form.jotform.co/70105059161850. I was provided CSS code to have columns 4 and 6 on a second line. It looks great, but it only works for the first item. Is there a fix for the code that will make it work correctly?
-
Victoria_KReplied on June 12, 2018 at 5:39 PM
Hello,
I am checking options to fix the code. I will be back with an update soon.
Thank you.
-
Victoria_KReplied on June 13, 2018 at 8:09 AM
Hello,
Please remove all the existing CSS codes injected into the widgets and use the following respectively.
For the first configurable list, inject this in it's CSS section:
.remove {padding: 2px 8px !important;}
.col7 {position: relative;left: -420px;}
#list > tbody > tr:nth-child(1) > th.col4 { display: none;}
tr { height: 60px;}
td.col4 { position: relative; top: 30px; left: -208px;}
td.col5 { position: relative; left: -210px;}
td.col6 { position: relative; top: 30px; left: -418px;}
select { width: 200px !important;}
input { width: 196px !important;}
button.add { margin-top: 65px;}
For the second config list, use this:
.remove {padding: 2px 8px !important;zoom: 0.8;}
.col8 {position: relative;left: -335px;}
#list > tbody > tr:nth-child(1) > th.col4, #list > tbody > tr:nth-child(1) > th.col6 { display: none;}
tr { height: 60px;}
td.col4 { position: relative; top: 30px; left: -168px;}
td.col5 { position: relative; left: -166px;}
td.col6 { position: relative; top: 30px; left: -334px;}
td.col7 { position: relative; left: -330px;}
select { width: 160px !important;}
input { width: 156px !important;}
button.add { margin-top: 65px;}
Related guide: How-to-Inject-CSS-Codes-to-Widgets
Let us know if there is anything else we could assist with.
Thank you.
-
ohsucmeReplied on June 13, 2018 at 11:49 AM
Thank you for your help!
-
ohsucmeReplied on June 22, 2018 at 4:22 PM
Hello,
I discovered an issue with the fields after adding the above CSS. For the first item everything works fine, but when rows are added, the drop-down on column 3 (what is the relationship) in subsequent rows isn't clickable. It's still possible to tab to the field and use the arrow keys to choose an answer, but clicking the drop-down doesn't activate it.
The issue is consistent across browsers.
-
Victoria_KReplied on June 22, 2018 at 5:28 PM
Hello,
I have added the following code into your widgets for your convenience:
Please check if the issue is resolved now.
We will gladly assist if you need more help.
Thank you.