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.
GridLayout Border
As I recall from other Forum threads, including my own thread, there is no way to draw borders directly on the cells of a GridLayout.
An alternative is to add borders to your content within the cell. I understand that may not give you the results you desire.
When I wanted divider lines to separate areas within my GridLayout, like this:
…I played around with adding extra rows or columns. I added a Label to span across the cells of the row or column. I displayed a non-breaking space character to effectively make the text portion of the Label invisible. Then I used CSS to add a border along the Label. This sorta/kinda works, but left me unsatisfied.
Someday if I get the nerve to try making a Vaadin component, I'll make a simple dividing line. I put in a ticket requesting such a widget.
Another alternative is using combining Layouts inside one big Layout. The child Layouts can have a CSS border.
--Basil Bourque
/* Grid with grid! */
.v-gridlayout-grid {
margin: 0px;
padding: 0px;
border: 1px solid gray;
}
.v-gridlayout-grid > div {
margin: 0px;
padding: 0px;
border: 0px solid gray;
}
.v-gridlayout-grid > div > div {
margin: 0px;
padding: 0px;
border: 0px solid gray;
}
.v-gridlayout-grid > div > div > div {
margin: 0px;
padding: 0px;
border: 1px solid gray;
}