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.
Margin/Padding Problem
Hello everyone,
I have a problem using the vertical-layout.
In my example I am using a vertical-layout with some elemnts in it (textfield, select-lists, ...). Now I know how to set the padding of the vertical-layout by using a style like this:
.myclass .v-verticallayout-margin {
padding: xxx px;
}
But how can I set a margin to specific elements IN the verticallayout? Lets say some get a margin and some other not. Hope anyone can help me...
I first got the idea of putting vertical/horizontal layouts around these elements, just to use the method from above. But this would cause the problem, that EVERY element wrapped by a horizontal/vertical layout would get this margin. Isn't there a way to only apply it to elements by using a classname?
Thank you
Chris
Chris To: But how can I set a margin to specific elements IN the verticallayout?
You can add a style name to any element, and then style that one individually in your css file. For instance:
Button button = new Button("I need space");
button.addStyleName("spacey-button");
Then in your css file:
.spacey-button {
margin-top: 20em;
}
There is also a setStyleName() method, but the 'add' one is preferred since it doesn't overwrite existing styles:
https://vaadin.com/api/com/vaadin/ui/Component.html#addStyleName(java.lang.String)
Cheers,
Bobby