Problem with shrunken fields and headings

  • Profile Image
    royaltaxi
    Asked on October 22, 2011 at 11:56 AM

    URL: http://form.jotform.com/form/12872718331

    After the heading "Passengers" in my form, I have only shrunken fields.

    The next two headings (Airport Reservation Data and Special request) doesn't get generated with its own LI element and its DIV is included in the previous LI.

    If I add one text field that occupies a whole line between the shrunken element and the next heading, everything is rendered correct.

    In general I guess it's not visible, but I've given top margin to the .form-header-group which is not respected for some elements.

    I tried deleting and creating everything several times. Tried with Forma collapse too, the result is always the same. Seems to be a BUG in the code generation. Tried fixing it with floats in the CSS with no success. The only way out is getting the complete code and fixing the HTML by hand, but I'd really like to use it as an IFRAME.

    Please, advise!

    PS. It will also be nice if we have the option for label position: NONE, which results in label not shown at all.

  • Profile Image
    royaltaxi
    Answered on October 23, 2011 at 03:37 AM

    Hello again,

    Why don't I get any answer from JotForm Support? It seems everybody else does...

    Shall I explain the problem more in detail?

    Thanks in advance!

  • Profile Image
    idarktech
    Answered on October 23, 2011 at 04:10 AM

    Hi,

    We do apologize for not responding personally to your issue. Yes, we would be thankful if you will share a screenshot and a detailed explaination on your concern.

    Again, sorry for the delay. Looking forward to your response.

    ~idarktech

  • Profile Image
    royaltaxi
    Answered on October 23, 2011 at 07:34 AM

    The problem is that the shrunken fields are floating elements, and if you don't put a normal field after them, the float is not cleared. If I add a clearing div between the last floating (shrunken) field and the heading element, everything is correct.

    You can see the screenshot if you open the URL of the form as well.

  • Profile Image
    idarktech
    Answered on October 23, 2011 at 09:03 AM

    Hi,

    Can you try injecting this css code?

     

    .form-line-column {

    float:none;

    }


    I have cloned your form and here's the result:

    http://www.jotform.com/form/12954603639

     

    Please let us know if there is anything we are missing so that we can provide you with a better solution. Thank you!

    ~idarktech

     

  • Profile Image
    royaltaxi
    Answered on October 23, 2011 at 12:53 PM

    Yes, that fixes it. Thanks a lot!

    PS. I will also hide all the labels that I don't need with display:none

  • Profile Image
    idarktech
    Answered on October 25, 2011 at 05:18 AM

    Hi,

    Sorry I didn't noticed your PS :) here's a workaround that you may try (Just simply add the code directly to your label to make it non-displayable)

    If you have any other concern just let us know, we'd be happy to help you.

    Have a great day!