How to align this field with the ones above it?

  • Profile Image
    Asked 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;}

  • Profile Image
    Answered on July 01, 2013 at 05:33 PM


    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?

    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!