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 to align this field with the ones above it?

    Asked by thegulbrandsengroup on July 01, 2013 at 05:14 PM

    I have a field that is not aligning the way I want it.  I am using custom CSS but not sure how to fix it.  Please see the image attached and the custom css.  Thank you!

     

    Here is the custom CSS being used...  

    .form-all {padding: 2px; border: 1px solid black;} .form-input {float: left; width: 170px;} .form-label-left {margin-right: 30px;} .form-radio-item label {margin-left: 2px;} .form-multiple-column .form-radio-item {width: 50px;} .form-line {border: 1px solid black;} #id_10.form-line, #id_8.form-line, #id_9.form-line, #id_2.form-line {border: none;} #id_10, #id_8, #id_9 {padding-left: 150px;} .form-header-group {background: none; border: none; margin-top: 30px;}

    .form-line{overflow:hidden;margin:5px 0;}

    Screenshot
    label hidden float item label
  • Profile Image

    Answered by pinoytech on July 01, 2013 at 05:33 PM

    Hi,

    Sorry for the inconvenience that may have caused. With regards to your query, may I ask to where would you like to align this field?

    Can you please take a look at this clone for if this is what you want to achieve?

    http://www.jotformpro.com/form/31817137990965

    If yes, please replace your current code with the codes bellow.

    .form-all {

    padding: 2px; border: 1px solid black;

    }

    .form-input {

    float: left; width: 170px;

    }

    .form-label-left {

    margin-right: 30px;

    }

    .form-radio-item label {

    margin-left: 2px;

    }

    .form-multiple-column .form-radio-item {

    width: 50px;

    }

    .form-line {

    border: 1px solid black;

    }

    #id_10.form-line, #id_8.form-line, #id_9.form-line, #id_2.form-line, #id_106.form-line {

    border: none;

    }

    #id_10, #id_8, #id_9, #id_106 {

    padding-left: 150px;

    }

    .form-header-group {background: none; border: none; margin-top: 30px;}

    .form-line{overflow:hidden;margin:5px 0;

    }

    If you need further assistance, do let us know.

    Thank you!