How to put elements in a single line?

  • Profile Image
    drakeladue
    Asked on November 20, 2013 at 01:19 PM

    Is there a way to change the column widht so that we content stays on one line when there is plenty of room on the form?

  • Profile Image
    ardy0689
    Answered on November 20, 2013 at 03:41 PM

    Hello. Thanks for posting your inquiry here on the forum.

    There are ways to take advantage of the extra spaces of the column as I can see each of your page on your form has its own issue.

    1. If this is the situation:

    You may increase the item width by inserting a Custom CSS Code. Please refer to this guide on How to insert Custom CSS Code

    Please use this code for this situation:

    .form-multiple-column .form-radio-item,.form-multiple-column,
    .form-multiple-column .form-checkbox-item{
    width:200px !important;
    }

    Please adjust the width value accordingly,

    2. If this is the situation:

    You have to shrink the fields:

    This will set them on 1 line.

     

    If you require further assistance, please do not hesitate to ask. Thank you

  • Profile Image
    drakeladue
    Answered on November 20, 2013 at 03:42 PM
    Thank you. Is there a CSS Map we can use so we don't have to bother you with little things like this?
    Drake LaDueCEO/Owner
    919-257-3977drake@brand-x-mobile.com
    ---- On Wed, 20 Nov 2013 15:41:03 -0500 JotForm Support Forum<jotform@jotmails.com> wrote ----
    A new response has been received:

    Answered by ardy0689

    Hello. Thanks for posting your inquiry here on the forum.
    There are ways to take advantage of the extra spaces of the column as I can see each of your page on your form has its own issue.
    1. If this is the situation:

    You may increase the item width by inserting a Custom CSS Code. Please refer to this guide on How to insert Custom CSS Code
    Please use this code for this situation:
    .form-multiple-column .form-radio-item,.form-multiple-column,
    .form-multiple-column .form-checkbox-item{
    width:200px !important;
    }
    Please adjust the width value accordingly,
    2. If this is the situation:

    You have to shrink the fields:

    This will set them on 1 line.

    If you require further assistance, please do not hesitate to ask. Thank you



    View this thread on JotForm Support Forum Unsubscribe



  • Profile Image
    ardy0689
    Answered on November 20, 2013 at 03:58 PM

    Thanks for replying back.

    As far as I know, we do not have a CSS Map that you can reference from. I think that would be a good idea to add on our user guide. I will tell our management about that.

    At the meantime, you can get the proper CSS classes that you want. Please see the screenshot below.

    This works for both Firefox and Chrome with the exact methods.

     

    Thanks

  • Profile Image
    drakeladue
    Answered on November 20, 2013 at 04:09 PM
    Thank you
    Drake LaDueCEO/Owner
    919-257-3977drake@brand-x-mobile.com
    ---- On Wed, 20 Nov 2013 15:58:44 -0500 JotForm Support Forum<jotform@jotmails.com> wrote ----
    A new response has been received:

    Answered by ardy0689

    Thanks for replying back.
    As far as I know, we do not have a CSS Map that you can reference from. I think that would be a good idea to add on our user guide. I will tell our management about that.
    At the meantime, you can get the proper CSS classes that you want. Please see the screenshot below.
    This works for both Firefox and Chrome with the exact methods.


    Thanks



    View this thread on JotForm Support Forum Unsubscribe



  • Profile Image
    drakeladue
    Answered on November 20, 2013 at 04:13 PM
    While I have your attention, can we hide the date? We want to record the date for how often people come into the store but the client wishes not to show it
    Drake LaDueCEO/Owner
    919-257-3977drake@brand-x-mobile.com
    ---- On Wed, 20 Nov 2013 15:58:44 -0500 JotForm Support Forum<jotform@jotmails.com> wrote ----
    A new response has been received:

    Answered by ardy0689

    Thanks for replying back.
    As far as I know, we do not have a CSS Map that you can reference from. I think that would be a good idea to add on our user guide. I will tell our management about that.
    At the meantime, you can get the proper CSS classes that you want. Please see the screenshot below.
    This works for both Firefox and Chrome with the exact methods.


    Thanks



    View this thread on JotForm Support Forum Unsubscribe



  • Profile Image
    ardy0689
    Answered on November 20, 2013 at 04:39 PM

    Thanks for the replying

    You can do that by inserting this Custom CSS Code. This will only work on this form and can not be used for general purposes.

    #id_46{

    visibility:hidden !important;
    height:0px !important;
    margin:0 !important;
    padding:0 !important

    }

    Please refer to this guide on how to inject custom css code. For future unrelated inquiries, please create a separate new thread for that.

    Cheers!

  • Profile Image
    drakeladue
    Answered on November 20, 2013 at 04:43 PM
    Thank you
    Drake LaDueCEO/Owner
    919-257-3977drake@brand-x-mobile.com
    ---- On Wed, 20 Nov 2013 16:39:56 -0500 JotForm Support Forum<jotform@jotmails.com> wrote ----
    A new response has been received:

    Answered by ardy0689

    Thanks for the replying
    You can do that by inserting this Custom CSS Code. This will only work on this form and can not be used for general purposes.
    #id_46{
    visibility:hidden !important;
    height:0px !important;
    margin:0 !important;
    padding:0 !important
    }
    Please refer to this guide on how to inject custom css code. For future unrelated inquiries, please create a separate new thread for that.
    Cheers!



    View this thread on JotForm Support Forum Unsubscribe