RE: How do you remove the cell borders in a Grid?

Vaadin 6 / 7 / 8
1

.yourgrid .v-grid-cell {
border: none !important;
}
this should be work.

2

I would like to remove the border around all the cells in a Grid. I don’t believe it’s possible to do with code, and the css for Table doesn’t apply to Grid, therefore how do you do this for Grid?

3

That worked great! Any idea how to also remove the border on the outside of the grid too?

4

You may try this;

.yourgrid .v-grid-tablewrapper{
border: none
}

5

The best way to modify Grid’s styling is by overriding the Sass variables defined in the Valo theme. For instance, to remove the all the borders, one would add $v-grid-border: none to the custom theme that overrides Valo. You can find all variables used in the [_grid.scss]
(https://github.com/vaadin/framework/blob/2c3df1adfdecdda7747ec63b00ab4a6c5e1315d3/themes/src/main/themes/VAADIN/themes/valo/components/_grid.scss#L3-L64) file. Find more info on how to use variables in the [documentation]
(https://vaadin.com/docs/v8/framework/themes/themes-valo.html).