GridLayout elements are overlaps

Hello, I got the problem with grid layout, want to create 3 x 3 grid with checkBoxes - ine the end I get component where this checkBoxes are overlaps; when I make one column and 3 row the elements are under themselves, one by one ;
for example I paste some code in to my project from vaadin book site - and the problem is the same - buttons are overlps with themselves in 1x1 cell

// Create a grid layout
            final GridLayout grid = new GridLayout(3, 3);
            Button topleft = new Button("Top Left");
            grid.addComponent(topleft, 0, 0);
            grid.setComponentAlignment(topleft, Alignment.TOP_LEFT);
            Button topcenter = new Button("Top Center");
            grid.addComponent(topcenter, 1, 0);
            grid.setComponentAlignment(topcenter, Alignment.TOP_CENTER);
            Button topright = new Button("Top Right");
            grid.addComponent(topright, 2, 0);
            grid.setComponentAlignment(topright, Alignment.TOP_RIGHT);

any idea? any solution :confused:


I don’t have a problem with your code and layout, see my screenshot. Which version of Vaadin are you using, which browser, and what is the parent container of the grid?

I try this in private class which extends verticalLayout, public class is extends class which extends CustomComponent
I use vaadin 7.0.6 - I checked in parent class and the problem is the same, all elements are overlaps