-
bobbyrenaudAsked on March 28, 2017 at 5:17 PM
Must be via CSS somehow
Page URL: https://form.jotform.us/70435198618160 -
Mike_G JotForm SupportReplied on March 28, 2017 at 10:05 PM
Yes, that is correct. Since there is no option in the widget's properties to set the button color and the size of the button, we can only do it with the help of CSS codes.
In the Form Designer, under CSS tab's Inject Custom CSS, please add the following CSS codes.
/*set button color and button size*/
#decfont, #incfont {
background: green !important;
width: 60px !important;
height: 60px !important;
}
/*distance between decrement and increment buttons*/
#incfont {
left: 68px !important;
}
I hope this helps. Please feel free to let us know if you need any further assistance and we will be glad to help you.
Thank you.
-
bobbyrenaudReplied on March 29, 2017 at 3:50 PM
Thanks...Did 30 x 20...Font?...A- unchanged
??
-
jonathanReplied on March 29, 2017 at 5:30 PM
Please try this CSS codes instead.
#decfont, #incfont {
padding: 26px 0px !important;
margin-left: 4px !important;
width: 60px !important;
height: 60px !important;
background: green !important;
}
#decfont {
left: -12px !important;
}
Example output:
You can adjust the numbers in px as needed.
-
bobbyrenaudReplied on March 30, 2017 at 11:23 AM
This is what it looks like now
with...
#decfont, #incfont {
padding: 26px 0px !important;
margin-left: 4px !important;
width: 30px !important;
height: 20px !important;
background: green !important;
}
#decfont {
left: -12px !important;
}
##############################
##############################
-
bobbyrenaudReplied on March 30, 2017 at 12:47 PM
-
Welvin Support Team LeadReplied on March 30, 2017 at 2:23 PM
I've modified the CSS, just play around with the padding until you get your desired output.
#decfont, #incfont {
padding: 10px 30px 10px 15px !important;
background: green !important;
font-size: 13px !important;
}
-
bobbyrenaudReplied on March 30, 2017 at 3:48 PM
Now got this... But... How to resize the bottons
also cant'align CENTER ?
#decfont, #incfont {
padding: 5px 15px 5px 8px !important;
background: #aaaacc !important;
font-size: 13px !important;
}
-
David JotForm Support ManagerReplied on March 30, 2017 at 5:21 PM
You can resize the buttons with the following code:
#incfont {
margin-left: 50px !important;
}
#decfont, #incfont {
width: 80px !important;
height: 80px !important;
}
#id_11 {
left: 36% !important;
width: 200px !important;
}
Result:
Let us know if you need more help.
-
bobbyrenaudReplied on April 3, 2017 at 11:06 AM
Thanyou all............Bob