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 keep the jotform code from changing existing webpage elements.

    Asked by rocketboy on May 12, 2015 at 12:55 PM

    The contact form on the page http://cleburneorthopedics.com/contact-us.html is breaking the navigation bar. In other words the last page on the right of the primary nav bar is dropping to the next line which is the "contact" link. Which code within the jotForm would be causing this or is there a way to keep this from happening? I tried taking little code pieces out at a time to see if I could troubleshoot the issue but seems the contact form is the root cause. Any help would be greatly appreciated.

     

    Thank You

     

    ***Issue only happening on Google Chrome, safari. not happening on IE.

    Page URL:
    http://cleburneorthopedics.com/contact-us.html

    JotForm elements keep contact form next primary
  • Profile Image
    JotForm Support Manager

    Answered by Jeanette on May 12, 2015 at 02:45 PM

    The problem is that you are using the full source code of the form and this is conflicting with some JS libraries in your page (Jquery)

    Please remove the current code and embed the form using the iFrame Code

     

  • Profile Image

    Answered by rocketboy on May 12, 2015 at 03:50 PM

    Thank you for your response. When using this Iframe code, how would you work with the css styling? On some computers the wrong colors are showing up on my drop down boxes.

     

    When I was using the source code this css code solved the issue:

    select.form-dropdown {
        background-color: white;
        height: 28px;
        width: 240px;
    }
    select.form-dropdown > option {
        background-color: white;
    }

     

    Once this was added to the css inside my jotform account it worked. I was adding this code in my actual website style.css. 

  • Profile Image
    JotForm Support

    Answered by Chriistian on May 12, 2015 at 04:41 PM

    Hi rocketboy,

     

    You can add those CSS by using Inject Custom CSS. Please see this guide on How to Inject Custom CSS Codes.

     

    Do let us know if you need further assistance.

     

    Regards.