Form height changing on different browsers

  • Profile Image
    daniellec
    Asked on March 20, 2013 at 03:37 PM

    Hello!

    I have a form on a test site that I am currently working on, and I got the form background height to line up with my slider on the homepage in Chrome & Safari but then I tested it in IE 9 and Firefox and it's shorter in height.. is there a cross browser solution to this?

    Thank you :)

    Danielle

  • Profile Image
    Welvin
    Answered on March 20, 2013 at 03:59 PM

    Hi Danielle,

    I can see that. Please try to embed your form using this codes:

    <iframe id="JotFormIFrame" allowtransparency="true" src="//form.jotform.us/form/30697123205146" frameborder="0" style="width:100%; height:457px !important; border:none;" scrolling="no"></iframe>

    See if that helps.

     

    Thanks

  • Profile Image
    daniellec
    Answered on March 20, 2013 at 04:10 PM
    Nope that makes it too long :(. I know I used iframe so I could customize the height in the first place, but it just doesnt match up from browser to browser unfortunately.
  • Profile Image
    Welvin
    Answered on March 20, 2013 at 04:25 PM

    Hi Danielle,

    I've check that and the form height are now the same. Please try to change the iframe height to match with your slider and compare again.

    Also inject this codes to your form to hide the labels on top. I can dots

    .form-label-top { display: none; }


    Thanks

  • Profile Image
    daniellec
    Answered on March 20, 2013 at 04:34 PM
    AH!!! I have been trying to get rid of the dots as well! THANKS :)
  • Profile Image
    daniellec
    Answered on March 20, 2013 at 04:36 PM
    Hm I tried that code in the css and it didn't change. Strange?
  • Profile Image
    ardy0689
    Answered on March 20, 2013 at 04:48 PM

    Hello,

    The dots are gone from my end. You should clear your browser's cache and check them again however, the height is not yet matched. Please match the iframe's height  to your slider just like what my colleague suggested earlier and please use Firefox as temporary browser when matching them.

  • Profile Image
    daniellec
    Answered on March 20, 2013 at 04:58 PM
    Yeah I can get rid of them temporarily. Every time I go to edit the form in Jotform.com the dots come back, because it's asking me to title them. But I just delete where it says "enter title text here" and then they go away again. I think I have the height down to a science
    is it good on your end?
  • Profile Image
    Welvin
    Answered on March 20, 2013 at 05:04 PM

    Hi Danielle,

    With regards to the height, it's perfect now!

    Firefox: http://screencast.com/t/5so818sgkNP

    IE: http://screencast.com/t/jD4owMmN

    Chrome: http://screencast.com/t/EAt70M8e61

    With regards to the labels, I've fixed that for you. 

     

    Thanks

  • Profile Image
    daniellec
    Answered on March 20, 2013 at 05:21 PM
    Thanks!!!!!!!!
  • Profile Image
    Welvin
    Answered on March 20, 2013 at 05:22 PM

    You are welcome! Let us know if you need anything else again. Thanks and have a great day!