Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
ComboBox Error Indicator behind components
I'm wondering why the error indicator of the ComboBox component lies behind every other component? Other component's error indicators are on top of all components.
This happens with all kind of webbrowsers, vaadin 6.7.2
You are using AbsoluteLayout right? Seems to be that the z-order of the components is affected of in which order you add the components. So e.g.
AbsoluteLayout layout = new AbsoluteLayout();
DateField a = new DateField();
b = new ComboBox();
b.setComponentError(new UserError("Error A"));
c = new ComboBox();
c.setComponentError(new UserError("Error B"));
layout.addComponent(b, "left:10px;top:200px;");
layout.addComponent(a, "left:10px;top:170px;");
layout.addComponent(c, "left:10px;top:230px;");
Causes the "b" ComboBox error indicator to be behind DateField "a". Changing
layout.addComponent(a, "left:10px;top:170px;");
layout.addComponent(b, "left:10px;top:200px;");
layout.addComponent(c, "left:10px;top:230px;");
And they are on top of each other and not behind.
That's right, I use the Absolute Layout and the order of adding components seems to affect the z-ordering.
I wish to have all component indicators to be on top, I thought to set the z-index of .v-errorindicator to something very high. Unfortunately it doesn't work, do I miss something?
.v-errorindicator {
z-index: 1000;
}
If all the error indicators have the same z-index then the stacking is done the same way if they had no z-index. https://developer.mozilla.org/en/CSS/Understanding_z-index.
edit: fixed link markup
I didn't know that but it seems to be obvious. I use the visual editor to create custom components and I won't like to change things within @AutoGenerated methods.
Vaadin doesn't support CSS injection yet but Jouni Koivuviita, the CSS expert, has created an add-on that might fit my needs.
However, is there any other way to bring them on top?
Did you already try to change the order which the components are added to the layout in the same order as they are visually displayed.
Yes I tried it and it works. However, I'm looking for another way since I design a lot of components with the visual editor. In my opinion it's a bit laborious to edit the @Autogenerated methods.
AbsoluteLayout itself would support z-index in the position string, but not sure if the visual editor supports it for AbsoluteLayout. I think VAbsoluteLayout always sets zIndex explicitly to the element, or resets it if not specified. To have your CSS rule for it taken into account, you might need to mark it as "!important".
Modifying @Autogenerated methods is problematic as the visual editor may rewrite them if you edit the class again.