RowReorder grip unaligned in RowNumber column

[JockeLindberg]

Forum post

Hi, While testing the cell selection feature, we encountered a few bugs that we'd like to report. All of these issues can be reproduced in the demo: https://bryntum.com/products/gantt/examples/cellselection/ (with rownumber column added)

2. Task Reordering Icon Alignment The grip icon used for task reordering is not properly aligned horizontally. To show the icons and be able to reproduce this in the demo, you have to enable this feature:

features: {
    rowReorder: true,
    ...
},

We resolved this on our end by applying a custom CSS class (fix-grip) to the row:

columns: [
    { id: 'rownumber', type: 'rownumber', text: '#', cellCls: 'fix-grip' },
    ...
]

.fix-grip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
}

Note: We had to add font-weight: 600 to ensure the icon displayed correctly, though we’re not sure if this was just an issue on our side. In your demo, the icon shows up correctly, it's just the alignment that is slightly off.