How can I fix form designer not displaying styling properly?

  • wagrosnow
    Asked on February 22, 2016 at 12:59 PM

    I am trying to fix a design error on our site and finding a lot of things I am maybe not understanding correctly:

     

    1. In the developer tool for the main survey page, it shows one thing, yet my live version is different? Why is this?!

    2. Is there a way to auto email anyone who completes the survey? If so, how can I have an automatic email sent to someone who just registered without having to manually input their email into a list?

    3. How do I change the font text within a dropdown box? Right now it is like a cursive and I can't find the field to change the dropdown.. I can updated the question text, but not the answers.

    Jotform Thread 778188 Screenshot
    Page URL: https://form.jotform.com/60396974938172
  • KadeJM
    Replied on February 22, 2016 at 3:17 PM

    From what I see and understand of your issue currently it looks like you are having some trouble with getting your form to display correctly after using the formdesigner.

    I found that I am able to replicate the problem when looking at it further and I think it is probably an issue with the css and the default theme overriding it somewhere but please allow us some time to investigate this problem further and we will respond to you again shortly.

    Additionally, you had another question about sending emails to anyone completing your form so I have moved that to this new thread here.

     

    How can I fix form designer not displaying styling properly? Image 1 Screenshot 20

  • KadeJM
    Replied on February 22, 2016 at 4:12 PM

    I believe I've found the cause of the problem.

    After spending some extra time on this investigating your issue I believe you might have cloned a form with the applied theme on it.

    So because of that the form is using the theme's hosted files on our server as it's default styling and that is the reason why when you compare it you are seeing it displaying differently.

    However, you can work around that issue by using the form designer and injected css to fix it.

    The css code below will force your applied new background image to override the theme's. And the second line of css code after that fixes your dropdowns. Any additional changes you could still do through the formdesigner which applies custom css to it.

     

    Updated Demo Form: https://form.jotform.com/60526337879972  [Clone Me!]

     

    CSS:

    html.supernova {

       background: none;

       background-image: url("https://files.jotform.com/jufs/wagrosnow/form_files/1401682_909056722447780_8986289531330705511_o.jpg");

    }

    .form-dropdown {

       font-family : "Arial", sans-serif;

    }

     

    SCREENSHOT OF NEW RESULT:

    How can I fix form designer not displaying styling properly? Image 1 Screenshot 20