-
sujil_highfieldAsked on June 8, 2017 at 9:34 PM
Hello Jotform,
At this form, https://form.jotform.co/71587038421861 on the second page, the item "Educational Qualification" in the configurable list is sticking out of the page border.
Please help edit to make it fall within the border.
Urgent help appreciated.Thanks
-
liyamReplied on June 8, 2017 at 11:38 PM
Hello,
You can replace this CSS injection into your Configurable list widget:
.checkbox, .radio {
margin: 3px 0;
min-width: 70px;
}.d {
display:none;
}tr {
display: block;
}td.col5 {
display: block;
position: relative;
top: 20px !important;
}td.col6 {
display: block;
position: relative;
top: -19px !important;
left: 145px !important;
}th {
display: none;
}.col1:before, .col2:before, .col3:before, .col4:before, .col5:before, .col5:before, .col6:before{
font-weight: bold;
}td.col1:before {
content:"Name";
display: block;
}td.col2:before {
content:"Designation";
display: block;
}td.col3:before {
content:"Contact Number";
display: block;
}td.col4:before {
content:"Gender";
display: block;
}td.col5:before {
content:"DOB";
display: block;
}td.col6:before {
content:"Qualification";
display: block;
}Here are the steps to insert this CSS code into your Widget:
1) Click the Widget Settings button
2) Go to Custom CSS tab
3) Paste the CSS code
4) Click the Update Widget buttonIf you have questions, please let us know.
-
sujil_highfieldReplied on June 9, 2017 at 1:28 AM
Hi Liyam,
Thanks for the help.
In the same configurable list, the DOB data is only collecting month and year. How to add the date as well?Thanks
-
sujil_highfieldReplied on June 9, 2017 at 1:43 AMHi Liyam,
Thanks for the help.
In the same configured list, the DOB data is only collecting month and
year. How to add date also to it ?
Thanks
... -
BJoannaReplied on June 9, 2017 at 3:52 AM
Remove this part of the CSS code that my colleage provide you.
.d {
display:none;
}
You will also need to move last field of your configurable list widget a bit more to the left. Change left from 145px to 200px, for this part of the CSS code:
td.col6 {
display: block;
position: relative;
top: -19px !important;
left: 145px !important;
}After that you configurable list widget will look like this.
Here is my demo form: https://form.jotformpro.com/71591396987981
Feel free to clone it.
Let us know if you need further assistance.
-
sujil_highfieldReplied on June 9, 2017 at 10:43 AMAwesome. Made changes in the original form.
Thanks for taking the time to make a clone.
Appreciate.
...