Help with css and check boxes

  • Profile Image
    Focus7
    Asked on July 27, 2011 at 04:38 PM

    Hi,

    I need check boxes that are required but uncheck.  Whenever I make them required, they automatically becomes checked.

    I also need some css to make my text stay normal when the submit button is press and all of the required sections have not been satisfied.

    http://form.jotform.com/form/12071944774

  • Profile Image
    NeilVicente
    Answered on July 27, 2011 at 06:13 PM

    Hi,

    You have quite a number of forms in your account. Would you please tell us the name of the form that's having problems with the check boxes?

    We'll look forward to your response. Thanks!


    Neil

  • Profile Image
    Focus7
    Answered on July 27, 2011 at 06:16 PM

    http://form.jotform.com/form/12071944774

  • Profile Image
    NeilVicente
    Answered on July 27, 2011 at 07:00 PM

    Hi,

    For the text box required field css, try this:

    .form-line-error {
        text-shadow: 0 1px 0 #EEEEEE;
        color: #0E0F0E !important;
    }

    As for the checkbox, it seems that an empty value always get chosen as the selected option.

    Now since the only option in your check boxes is an empty value (a blank space), it will always get selected no matter what.

     

    What I can advise you to do is to consolidate your checkboxes to a single one, using the Options button to insert them.

    You may use the css code below to align the boxes to the right, if that's what you prefer:

    .form-checkbox {
    margin-top:1px;
    margin-left:5px;
    margin-right:5px;
    float:right;
    }
    .form-checkbox-item {
    float:right;
    }

     

    ----------------------------

     

    Another option is to replace the empty value in the checkboxes, with any value, such as "Yes"

     

    Then hide these values using this css:

    .form-checkbox-item label {
    display: none;
    }

     

    Hope this helps.


    Neil

  • Profile Image
    Focus7
    Answered on July 27, 2011 at 07:23 PM

    Hi Neil,

    Thanks for the help.

    I got the test and the checkmarks fixed but no joy with the float right???

    Jason

  • Profile Image
    JasonSmith
    Answered on July 27, 2011 at 07:43 PM

    OK maybe I see what you mean.

  • Profile Image
    Jason
    Answered on July 27, 2011 at 07:57 PM

    Almost got it but have issues with alignment.

     

    When I put in the longest sentence, I end up wih two options on one line.

     

  • Profile Image
    NeilVicente
    Answered on July 27, 2011 at 08:06 PM

    Hi Jason,

    Sorry for the confusion, you should only use either of the solutions I offered above for the checkbox. The first one is by consolidating all the checkboxes into a single one and injecting custom css.

    The second one is by replacing the empty value option in your existing checkboxes, and then hiding them via css.

    It's either this

    or this: