How can I change the width of the selection columns?

  • Profile Image
    noisyspace
    Asked on March 09, 2011 at 04:00 AM

    I have a large list of seelctions and some flow onto two lines. These then do not align properly where the second line of text does not indent. Can I either change this in the prefs. Selecting 2 columns does not spread these over the full width. Any help much appreciated:

     

     

     

    Steve

  • Profile Image
    louc4u
    Answered on March 09, 2011 at 10:59 AM

    Hi,

    Go properties:click to edit, click spread colums. You can increase the space between the selection.

  • Profile Image
    noisyspace
    Answered on March 09, 2011 at 11:03 AM

    Hi This does not change the space between the columns only adds more or less columns. I need to increase the coloumn width?

  • Profile Image
    NeilVicente
    Answered on March 09, 2011 at 11:33 AM

     

    Hi,

    I believe that aligning the second line with the first is not possible.

    You can instead adjust the select box's width so that 2 lines become just one.

    Go to Setup & Share > Preferences > Form Style > Inject Custom CSS

    Try this piece of code

    .form-checkbox-item {
    width: 200px !important;
    }

     

    Note: Increase or decrease the width (200px) to accommodate the text in your checkbox options. Hope this helps.

  • Profile Image
    CIWisc
    Answered on September 25, 2011 at 10:51 PM

    I've tried that, but it still isn't spreading the columns out enough.  Can you please take a look?

    http://form.jotform.com/form/12664845262

    Thank you!

  • Profile Image
    aytekin
    Answered on September 26, 2011 at 09:48 AM

    You can try increasing this:

    .form-checkbox-item {

        width: 200px;

    }

    Make it 300px or more. That should do what you would like. 

  • Profile Image
    CIWisc
    Answered on September 26, 2011 at 11:03 AM

    That was PERFECT!  I just had to change my column spread to an even number to make the selections lay out nicely.  Thanks so much!

  • Profile Image
    CIWisc
    Answered on September 26, 2011 at 11:50 AM

    Okay, I'm stumped.  I made the adjustment and was very please with the look, but apparently the "look" is only in edit mode.  When I save the form and view it, it's back to being mashed up again.  Any ideas?

    http://form.jotform.com/form/12664845262

  • Profile Image
    CIWisc
    Answered on September 26, 2011 at 11:58 AM

    I should add that I've changed that width to 380px

  • Profile Image
    NeilVicente
    Answered on September 26, 2011 at 12:53 PM

    @CIWisc

    The form's default CSS codes override the custom css you injected. Kindly append !important to the width property, so that it becomes:

    .form-checkbox-item {
        width: 380px !important;
    }

    Please feel free to contact us again if you have other questions or concerns. Thank you!


    Neil

  • Profile Image
    CIWisc
    Answered on September 26, 2011 at 01:07 PM

    BEAUTIFUL!!  THANK YOU!

  • Profile Image
    abajan
    Answered on September 26, 2011 at 01:09 PM

    Hi CIWisc

    Glad our team was able to come through for you.

    Cheers :)


    ~ Wayne

  • Profile Image
    KadeJM
    Answered on December 05, 2014 at 10:40 AM

    Josh, we understand you are having a related issue but it is requested that you please open your issue into a new separate thread so that we can investigate the problem by itself to help prevent any possible confusion. I tried to move the thread for you but since you were not fully logged in I seem to be unable to do this for you.