Broken table header in IE10 using Valo, Vaadin 7.3.10

Dear All

using Valo I face issues with the table header in IE10 (all other browsers work fine). I’ve changed the book’s example to make it reproducible. Whenever you set a column width explicitly the header breaks if you use sorting.

Is there a know workaround? I saw similar tickets on this (the last one issued by me)

The issue can also be reproduced on the Valo demo.

Table table = new Table("The Brightest Stars");
table.setSizeFull(); // Define two columns for the built-in container

table.addContainerProperty("Name", String.class, null);
table.addContainerProperty("Mag", Float.class, null);
table.addContainerProperty("Date", Date.class, null); // Add a row the hard way

Object newItemId = table.addItem();
Item row1 = table.getItem(newItemId);
row1.getItemProperty("Mag").setValue(-1.46f); // Add a few other rows using shorthand addItem()

table.addItem(new Object{"Canopus", -0.72f, Date.valueOf("2015-01-01")}, 2);
table.addItem(new Object{"Arcturus", -0.04f, Date.valueOf("2014-12-02")}, 3);
table.addItem(new Object{"Alpha Centauri", -0.01f, Date.valueOf("2014-12-03")}, 4); // Show exactly the currently contained rows (items)



table.setColumnWidth("Name", 150); //Breaks header on Sorting
table.setColumnWidth("Date", 490); //Breaks header on Sorting


Here is the picture…

Friends, I would like to push it up. Is there anyone who uses Valo with IE10?