-
jdhoustonformsAsked on June 3, 2019 at 3:55 PM
I'm trying to reduce the size of the label fonts in the "Dates Difference" widget using the CSS code editor. I need help with the code... nothing I've used has worked.
Please help, thank you.
-
Kevin Support Team LeadReplied on June 3, 2019 at 6:34 PM
Try injecting this CSS code to the widget:
.date-input {
font-size: 5px;
padding: 6px !important;
}
You can change the font-size value with another one you want, this guide will help you injecting the code to your form: https://www.jotform.com/help/428-How-to-Inject-CSS-Codes-to-Widgets
I hope this helps.
-
jdhoustonformsReplied on June 3, 2019 at 7:43 PMPERFECT. Thank you.
I would have lost 5 years off my life trying to figure that out.
... -
jdhoustonformsReplied on June 3, 2019 at 7:43 PMAlso, is there a way to include a calendar avatar out to the side of the field using the Date Difference widget-- like below?
[cid:image003.jpg@01D51A3E.03E32510]
... -
Kevin Support Team LeadReplied on June 3, 2019 at 9:14 PM
You may try with the following code which will add a calendar icon:
.date-container li::before {
content: url("https://cdn.jotfor.ms/images/calendar.png");
}
The guide given before will help you injecting this to the widget.
You may also replace the image with your own image providing the URL.