What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Text Resizer widget: Change button color and button size.

    Asked by bobbyrenaud on March 28, 2017 at 05:17 PM

    Must be via CSS somehow

    Page URL:
    https://form.jotform.us/70435198618160

  • Profile Image
    JotForm Support

    Answered by Mike_G 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.

  • Profile Image

    Answered by bobbyrenaud on March 29, 2017 at 03:50 PM

     

    Thanks...Did 30 x 20...Font?...A- unchanged

    ??

     

  • Profile Image
    JotForm Support

    Answered by jonathan on March 29, 2017 at 05: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.

     

     

  • Profile Image

    Answered by bobbyrenaud 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;

    }

    ##############################

    ##############################

     

     

  • Profile Image

    Answered by bobbyrenaud on March 30, 2017 at 12:47 PM

    I still need smaller ..

       now  w=30 h=20 ??? 

     

    https://form.jotform.us/70435198618160

  • Profile Image
    JotForm Support

    Answered by Welvin on March 30, 2017 at 02: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;

    }

  • Profile Image

    Answered by bobbyrenaud on March 30, 2017 at 03: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;

    }

  • Profile Image
    JotForm Support

    Answered by BDAVID on March 30, 2017 at 05: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.

  • Profile Image

    Answered by bobbyrenaud on April 03, 2017 at 11:06 AM

    Thanyou all............Bob