What is the CSS code to align the quantity boxes adjacent to the field names?

  • Profile Image
    JCWBA
    Asked on June 03, 2013 at 02:23 AM

    Hi,

     

    I was wondering if anyone would know how to align the quantity boxes of the attached form so they appear next to the label.  The form is really long!  I would like to shorten it by having the quantities next to the labels.

     

    Would really appreciate any help.

  • Profile Image
    EltonCris
    Answered on June 03, 2013 at 03:58 AM

    Hi there!

    Here's the CSS codes. Simply inject this to your form. How to Inject Custom CSS Codes to your Form

    .form-product-item .form-sub-label-container {

    margin: 1px 9px 1px 0px !important;

    position: absolute;

    left: 230px;

    top: 0px;

    }

    .form-product-item .form-checkbox {

    vertical-align: middle !important;

    margin-top: -3px !important;

    }

    .form-product-item br {

    display: none !important;

    }

    .form-product-item {

    width: 316px !important;

    margin-bottom: 2px !important;

    }

    As a result:

    Do let us know if you have further questions. Thank you!

  • Profile Image
    JCWBA
    Answered on June 03, 2013 at 04:34 AM

    Genius.  Thank you for taking the time to answer.  That is perfect.

  • Profile Image
    EltonCris
    Answered on June 03, 2013 at 04:57 AM

    @JCWBA

    You're welcome. :)

    Let us know if you have any other questions or concerns. 

    Cheers!

  • Profile Image
    JCWBA
    Answered on June 03, 2013 at 05:14 AM

    Very kind.  I do actually have one quick question and that is to remove some of the space at the top of the form - there seems to be some padding of about 30-40px? Can this be reduced at all? 

     

    Thanks once again.

  • Profile Image
    EltonCris
    Answered on June 03, 2013 at 05:21 AM

    Add this:

    .form-all {

    padding-top: 0px !important;

    }

    Thanks!

  • Profile Image
    JCWBA
    Answered on June 03, 2013 at 05:54 AM

    Superb.  Thanks a lot for that.

  • Profile Image
    sidharth_kch
    Answered on June 03, 2013 at 05:58 AM

    @JCWBA

    On behalf of my colleague EltonCris, you are welcome.

    Should you have any questions please feel free to contact us.

    Thanks,

    Sidharth

  • Profile Image
    Issacliu
    Answered on March 09, 2017 at 04:07 AM

    Hi Jot support, I've used above code for my jotform, but quantity boxes are not displayed on form page: for reference please check my form: https://www.jotform.me/form/70670343280451

    Kindly let me know how to fix it.

    Many thanks

  • Profile Image
    liyam
    Answered on March 09, 2017 at 07:10 AM

    Hello Issacliu,

    Since this is an old thread and your form may have different IDs compared to the solution provided on this topic, I have moved your inquiry on to a new one. Well get back to you as soon as possible.

    Thanks.

  • Profile Image
    safewills
    Answered on March 09, 2017 at 10:42 PM

    Hi Iiyam, can you please give me the link of thread where your shifted my query.

     

    p.s. please note I've added responsive code in form, so the qty box appear on mobile. but that code is not working and that's the main issue.

    Thanks

  • Profile Image
    EltonCris
    Answered on March 10, 2017 at 12:09 AM

    @safewills

    Are you the same user as Issacliu? Here's the thread https://www.jotform.com/answers/1085644.