Multiple choice field is out of placed when viewed on IE 11

  • Ryan
    Asked on March 14, 2018 at 2:13 PM

    The form in the DBE section is bugging out in Explorer 11 or Edge. Looks fine in Safari, Chrome and Firefox. I attached a screenshot. It is taking the three columns and smashing them down.

    Thanks!

    Jotform Thread 1415090 Screenshot
    Page URL: https://walshfluor.businesscatalyst.com/index.html
  • Richie JotForm Support
    Replied on March 14, 2018 at 2:44 PM

    I checked your form on IE 11 and replicated the issue.

    Multiple choice field is out of placed when viewed on IE 11 Image 1 Screenshot 30

    Kindly try to use the IFrame code without the <script></script> part.

    Multiple choice field is out of placed when viewed on IE 11 Image 2 Screenshot 41

    Let us know how it goes.


  • Rynodesign
    Replied on March 14, 2018 at 3:43 PM
    Thank you for helping me out. Here is what happened when I deleted the
    script part. Please let me know what I am doing wrong. Thanks!
    ...
  • Richie JotForm Support
    Replied on March 14, 2018 at 4:04 PM

    Your screenshot did not go through, kindly follow this guide  to post screenshots in the thread.

    How-to-add-screenshots-images-to-questions-to-the-support-forum

    Thank you.


  • Ryan
    Replied on March 14, 2018 at 4:09 PM

    I am not sure what I did wrong here. I must have cut the wrong thing.

    1521058145Screen Shot 2018 03 14 at 2 Screenshot 10


  • Richie JotForm Support
    Replied on March 14, 2018 at 4:25 PM

     Make sure to remove your previews IFrame code with <script> and use the new one without the <script>

     <iframe
          id="JotFormIFrame-80506538245154"
          onDISABLEDload="window.parent.scrollTo(0,0)"
          allowtransparency="true"
          allowfullscreen="true"
          src="https://form.jotform.com/80506538245154"
          frameborder="0"
          style="width: 1px;
          min-width: 100%;
          height:539px;
          border:none;"
          scrolling="no"
       
        </iframe>
        <script >      </script>


    Let us know how it goes.

  • Ryan
    Replied on March 14, 2018 at 4:45 PM

    https://walshfluor.businesscatalyst.com/index.html#home

    I don't have internet explorer on my mac, but my coworker says it is still messed up. Please advise. I am not sure what to do to fix it.

  • aubreybourke
    Replied on March 14, 2018 at 6:14 PM

    I checked your embedded form in MS Edge and it looks fine:

    1521064491web Screenshot 10

    Then I checked it in MS Internet Explorer:

    15210646549pfaf Screenshot 21

    So it seems this is affecting MS IE only! It happens on the direct link to your form and also on your embedded form.

    You can resolve this by using CSS. Please add this code under what you already have

    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      [data-type="control_checkbox"] .form-input-wide, .form-checkbox-item {
        max-width: 890px !important;
    }
    }

    Instructions here:

    How-to-Inject-Custom-CSS-Codes