Increase width of scale rating field

  • Profile Image
    lshad24
    Asked on January 16, 2012 at 03:30 PM

    Can you tell me what CSS inject to add to increase the table width of the scale rating?  Also, I would like to remove the numbers above the scale.  Thanks!

  • Profile Image
    fxr
    Answered on January 16, 2012 at 04:50 PM

    Try these:

    .form-scale-table {width:100% !important; }

    .form-scale-table th {visibility:hidden; }

     

    You can experiment with the width of that first one. 

  • Profile Image
    lshad24
    Answered on January 17, 2012 at 09:24 AM

    That worked; however, the word on the leftmost of the scale is too far from the radio buttons.  Can I move it closer?

  • Profile Image
    fxr
    Answered on January 17, 2012 at 11:02 AM

    its quite difficult to know exactly what you are looking at without an example form. 

    Have tried experimenting with the width of .form-scale-table ?

    100% is probably too large and may be be a reason for the issue you describe, it may be better setting it explicity with something like: 

    .form-scale-table {width:300px !important; }

  • Profile Image
    lshad24
    Answered on January 17, 2012 at 11:15 AM

    Youa re correct.  I have added your suggested code to a sample http://www.jotform.com/form/20152834143

     

    Notice how much space is between the label "worst' and the first radio button.  Can I decrease that space? 

  • Profile Image
    fxr
    Answered on January 17, 2012 at 12:34 PM

    I cant find any CSS selectors to manipulate the space between that 'worst' and the first radio option.

    The best I can do balancing the control up is set the width as:

    .form-scale-table {width:400px !important; }

    Then adding a few spaces before the 'best' 

     

    Form here: http://form.jotform.com/form/20162411145