gwtuibindergwtbootstrap3

GWTBootstrap3 components rendering incorrectly in IE11


My page elements should appear in all browsers as follows:

enter image description here

I can only achieve this in IE11 by having the dev tools open during page load, otherwise the page generates as the following:

enter image description here

Summary

This issue is only with IE11, the site works in chrome, firefox and even Safari without any additional plumbing. I have found some IE fixes on SO, but so far none of them have worked:

*.html - add meta information to use Edge engine

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<html>
  <head>
    <!--[if IE]>
        <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <![endif]-->

    ... html continues with rest of head

*.js - to prevent undefined console from blocking processing

 if(!window.console) {
            console.log(item);
        }

I have been sure to use Ctrl F5 when reloading the page for testing, and have also restarted devmode to see if that makes a difference. I have also confirmed that the site is not running in compatibility mode by looking in the compatability settings.

Looking through the logs I can see that when the page loads with dev tools closed, the binding is carried out using user.agent=ie8, whilst with devtools open, the binding property is user.agent=gecko1_8. I thought IE11 should always use the gecko1_8 permutation - why could this not be happening?

(using GWT Version 2.7)


Solution

  • Not sure if this will be of any help. We are using GWT (2.8, but I think it also worked with 2.7 in the past). With GWT-Bootstrap3 (https://github.com/gwtbootstrap3/gwtbootstrap3) without any problems in IE11. I am not sure you are using the same bootstrap library ?

    Anyway. We added the following line in our html file (as the first line of the head tag) :

    <meta http-equiv="x-ua-compatible" content="IE=10">
    

    I can not really remember how I came up with this line, but the version history states : "It is now possible to use IE11 in compatibility mode"

    So it has to do something with fixing something in IE-11, using GWT and bootstrap 3 :-)