I have a table of ant design in react and I want to make table row background color changing when hovering on it. Actually I have done it by checking other answers but my problem is that the hover color is disappearing in like 1 second. I mean when I hover over the row, the background color is changing like 1 second but then returning to its normal color.

Here is the code:

return (
        <div className='card-holder'>
            <Card className='card-section'>
                <Table rowKey='id' dataSource={wallets} columns={columns} className='table'></Table>
            </Card>

And the css is:

.table {
    /*empty*/
}

.table tr:hover {
    background-color: yellow ;
}

Why is it returning back to original color in just 1 second ? I want to make the background color permanent as long as the mouse cursor stays on the row ?