CODEWITHSUNDEEP
angularag-gridag-grid-angular
Thomas Perez
Thomas Perez

Reputation: 171

How to have separators between cells using balham theme?

I love AgGrid's Balham theme but I'd like to have separators between the cells. Just like the separators between the column's headers.

I am using AgGrid Enterprise 19.1.4 with Angular 7.

Can anyone help me?

Upvotes: 1

Views: 4504

Answers (1)

Niall Crosby
Niall Crosby

Reputation: 399

You will need to put in some CSS to the ag-cell. Here is an example: https://plnkr.co/edit/EyJEtF7wzWsdpzCJFzGm?p=preview

.ag-theme-balham .ag-ltr .ag-cell {
  border-right: 1px solid #aaa;
}

The example uses CSS class selector .ag-theme-balham .ag-ltr .ag-cell as that is the CSS selector ag-Grid uses for border-right, so it overrides what the grid puts. If you want a simpler selector, just put !important to make sure the new CSS get's used and not the grids.

You could also look at generating our own theme, explained here: https://www.ag-grid.com/javascript-grid-styling/

However creating your own theme would be overkill just for adding a border.

Upvotes: 3

Related Questions