Dash AG Grid column styling


How do I get vertical lines in between columns in Dash AG Grid?

Hi, you can style the borders through CSS as explained in the documentation Styling Borders | Dash for Python Documentation | Plotly.
For vertical lines you can add 2 lines at the bottom:

.ag-theme-alpine.borders {
    /* disable all borders */
    --ag-borders: none;
    /* then add back a border between rows */
    --ag-row-border-style: dashed;
    --ag-row-border-width: 5px;
    --ag-row-border-color: rgb(150, 150, 200);
    --ag-cell-horizontal-border: solid black;
    --ag-header-column-separator-display: block;

Example grid with vertical lines:


Thank you Werner.

1 Like