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

    How can I increase size of scale buttons, and remove number labels?

    Asked by penrithtoyota on May 10, 2016 at 11:41 PM

    Hi there,

    Can someone please assist with:

     

    1. Removing the number labels on a scale field, so there is no fields visible.

    2. Make the scale buttons large in size?

    3. If possible, remove the lines that appear above the scale buttons?

     

    The form can be seen at https://form.jotform.co/61302852671856

    Many thanks,

    Page URL:
    https://form.jotform.co/61302852671856

    size and scale increase
  • Profile Image
    JotForm Support

    Answered by Chriistian on May 11, 2016 at 12:16 AM

    You can inject the custom css below to resolve increase the size of the scale buttons and remove the number labels:

    .form-scale-table th {

        display: none;

    }

    .form-scale-table td input {

        width: 50px;

        height: 50px;

    }

    .form-scale-table td {

        padding-right: 55px!important;

    }

    To inject CSS, simply follow this guide: How To Inject Custom CSS Codes

    If you need further assistance, please let us know.

  • Profile Image

    Answered by penrithtoyota on May 11, 2016 at 02:00 AM

    Thanks for your help, that worked perfectly!

    Just to add to that, is there anyway I can increase the padding between the scale buttons - and spread them across the page more?

    I'd like to have these align (as much as possible) to the emoticons above.

  • Profile Image
    JotForm Support

    Answered by Chriistian on May 11, 2016 at 02:19 AM

    You can remove the previously injected css and replace it with the new one below. The yellow highlighted text adjusts the distance between each scale buttons.

    .form-scale-table td input {

        width: 50px;

        height: 50px;

        margin: 0 85px 0 0!important;

    }

    .form-scale-table th {

        display: none;

    }

    .form-scale-table td {

     

    }

    Do let us know if you need further assistance.
    Regards.

  • Profile Image

    Answered by penrithtoyota on May 11, 2016 at 02:29 AM

    Thanks! Lastly..

    how can I remove the yellow highlight effect that shows over the question being answered? I've seen other posts on the forum regarding choosing Preferences > Field Styles. 

    However, when I choose Preferences - I dont get the fields styles (or preferences) pop up box.

  • Profile Image
    JotForm Support

    Answered by beril on May 11, 2016 at 02:42 AM

    On behalf of my colleague, you're most welcome. I've created a separate thread for you, so anyone in the support staff will be able to assist you with your specific requirement. Please follow up there:

    https://www.jotform.com/answers/836624