[Very Urgent] How to specific Vaading is using IE for better show

Dear all,

I am using Vaadin to develope a web application, the gui looks quite beautiful in Chrome browse.However, when I change to use IE8, the display turn to be very ugry, seems some css no take effect in IE?

Could vaadin has any api for spefify what IE is using?

Hello Jason,

Vaadin by default is supports multiple browsers. So can you please elaborate what do you mean by ugly? Are you using any addons or widgets? if so did you compile the widgetset for all browsers? Also, please cross check your styles.css if you have used on browser specific css…

Please let us know if you are still facing the issue. Also if you have used widgets/addons please share your *.gwt.xml contents

You can get user browser with following code:

UI.getCurrent().getPage().getWebBrowser() Then you can check browser and version and use diiferent code if you see, that user has an “old” browser.

1.my *.gwt.xml

<?xml version="1.0" encoding="UTF-8"?>
<!-- Inherit DefaultWidgetSet -->
<inherits name="com.vaadin.DefaultWidgetSet" /> 

 Uncomment the following to compile the widgetset for one browser only.

 Multiple browsers can be specified as a comma separated list. The
 supported user agents at the moment of writing were:

 The value gecko1_8 is used for Firefox and safari is used for webkit
 based browsers including Google Chrome.
<!-- <set-property name="user.agent" value="safari"/> -->

 To enable SuperDevMode, uncomment this line.

 See https://vaadin.com/wiki/-/wiki/Main/Using%20SuperDevMode for more
 information and instructions.
<!-- <set-configuration-property name="devModeRedirectEnabled" value="true" /> -->

<inherits name="com.hsbc.gbm.gfx.tradePortal.ui.AppWidgetSet" />

What I intent to is IE could also show the same display type with Chrom, not choose to use another set of code IE specific.

Anyway,thanks a lot, buddy

Hey Jason,

I don’t see an issue with your gwt.xml

I just wanted to check the below line -

<set-property name="user.agent" value="safari"/> As it is commented out, I dont see an issue. Try performing a clean build and check. If the UI is same, I would suggest you to take a relook at your CSS that is causing the issue…

My theme is using Vaadin Reinder and Valo, is that not take effect in IE 8?


I meant the CSS/SASS you have written based on your application requirements/needs. Vaolo & Reindeer support all major browsers even IE8. I would suggest you to check if the css you have coded is according to the standards/applicaple to all browsers


Thx buddy

I check the css complied out from scss,I saw this two kind of css, prefix is not v-ie8, or is v-ie8, is it relate to this?
should all css has v-ie8 start as prefix?

1…v-shadow, .v-shadow-window {
display: none;

.2.v-ie8 .v-shadow, .v-ie8 .v-shadow-window {
display: block;

.v-ie8 .v-shadow .top, .v-ie8 .v-shadow-window .top {
position: absolute;
top: -6px;
right: 10px;
bottom: 6px;
left: -10px;
background: black;
filter: alpha(opacity=5) progid:DXImageTransform.Microsoft.blur(pixelradius=10, makeShadow=false);