diff --git a/docs/data/migration/migration-data-grid-v6/migration-data-grid-v6.md b/docs/data/migration/migration-data-grid-v6/migration-data-grid-v6.md index 6f52bc1d05abd..cdfd95277d1f5 100644 --- a/docs/data/migration/migration-data-grid-v6/migration-data-grid-v6.md +++ b/docs/data/migration/migration-data-grid-v6/migration-data-grid-v6.md @@ -510,7 +510,20 @@ See the [Direct state access](/x/react-data-grid/state/#direct-selector-access) - The `.MuiDataGrid--pinnedColumns-(left\|right)` class for pinned columns has been removed. - The `.MuiDataGrid-cell--withRenderer` class has been removed. - The cell element isn't `display: flex` by default. You can add `display: 'flex'` on the column definition to restore the behavior. - NOTE: If you're using **dynamic row height**, this also means cells aren't vertically centered by default anymore, you might want to set the `display: 'flex'` for all non-dynamic columns. This may also affect text-ellipsis, which you can restore by adding your own wrapper with `text-overflow: ellipsis;`. + + **NOTE**: If you're using **dynamic row height**, this also means cells aren't vertically centered by default anymore, you might want to set the `display: 'flex'` for all non-dynamic columns. This may also affect text-ellipsis, which you can restore by adding your own wrapper with `text-overflow: ellipsis`. + + ```tsx + { + display: 'flex', + renderCell: ({ value }) => ( +