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

    Form collapse issues in hover and active states

    Asked by NursesUSA on November 26, 2014 at 06:37 AM

    There are several issues with this form collapse:

    1. On form designer, I cannot access any of the question which are in a  " collapse form"  section.  So I cannot change the css for them.

    2. The form collapse buttons change size in hover and active states, although I did not include this in the css.

    3. The form collapse buttons will not display the "active"  styling when the section is open.

     

    Page URL:
    http://form.jotform.me/form/42872559767473?

    and form designer size section 3
  • Profile Image
    JotForm Support

    Answered by Charlie on November 26, 2014 at 11:12 AM

    Hi,

    I see that you have a lot of CSS styling in your end. This is causing a lot of conflict of some of your styling.

    Here is the edited one that I have: http://form.jotformpro.com/form/43294479350966 

    1. On form designer, I cannot access any of the question which are in a  " collapse form"  section.  So I cannot change the css for them.

    This is because the Collapse field is set to "closed", if you would like to see the content of the collapse field in your form designer you can follow the screenshot below.

    1.1 In Form Designer, the collapse is not showing even when clicked.

    1.2 If you want to show the content under the collapse field, you can open it by change the status under Properties.

    1.3 After that, it will show the content under the collapse field.

     

    2. The form collapse buttons change size in hover and active states, although I did not include this in the css.

    This is because you have conflicting width size on your CSS for classes .form-section and .form-section-closed

    I added this CSS code to correct that:

    .form-section, .form-section-closed {

        max-width : 100%;

        margin-left : auto;

        margin-right : auto;

    }

     

    3. The form collapse buttons will not display the "active"  styling when the section is open.

    Now, I'm having a hard time finding where the problem is, but I believe one of the element is set to have a default background color, regardless if it is the collapse field is active or not.

    I would suggest that you look for the element that conflicts the active state of your collapse field. But I will still try to investigate to where it is conflicting.

    For now, please do see the edited cloned form that I shared above.

    Thank you.