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

    Dropdown Is Wider than Other Fields When Form Is Embedded in My Web Page

    Asked by Dannilee on July 26, 2015 at 05:32 PM

    Hi

    Please can you take a look at my form and advise me how to correct the width of the drop down field, currently it appears longer that the other input boxes in FF.

    http://www.lm-lakeland-design.co.uk/About-Us.html

     

    Thanks

    D

    embedded drop down wider embedded dropdown
  • Profile Image
    JotForm Support

    Answered by jonathan on July 26, 2015 at 06:57 PM

    Hi,

    When I checked the embedded form on your website using Firefox browser, I could not see the inconsistent width issue of input fields in the form.

     

    Are you still having this issue? Can you share to us a screenshot also.

    Perhaps I am checking the wrong thing.

     

    Thanks.

     

  • Profile Image
    JotForm Support

    Answered by abajan on July 26, 2015 at 08:31 PM

    Hi D,

    Upon examining the jotform on your web page, I noticed that the right edge of the drop down protrudes beyond the right edges of the text boxes and text area not just in Firefox but also in Chrome. However, the form at its own URL (http://www.jotformeu.com/form/51707972830359) doesn't exhibit this issue in either browser.

    I'm not sure what could be causing the issue because the form is already embedded via an iFrame which is the method we recommend to avoid conflicts with web page scripts and CSS. I've downloaded your web page to my computer to investigate this further. I'll inform you as soon as I find out anything.

    Thanks

  • Profile Image
    JotForm Support

    Answered by abajan on July 26, 2015 at 09:22 PM

    Hi again,

    Please do the following:

    1. Go into the form Designer:


    2.
    Click the CSS tab:


    3.
    In the work area of that tab, find the following rule:

    #input_28 {
       font-family : Arial;
       font-size : 14px;
       width : 284px;
    }

    and add !important to its last declaration, as follows:

    #input_28 {
       font-family : Arial;
       font-size : 14px;
       width : 284px !important;
    }

    4. Save the form:


    That should fix it.

    Thanks