Style individual columns instead of entire row

[SilasNiewierra]

Hi there,

I would like to style a specific column, based on the slot instead of having all columns with the same style.
I know the :items-class="..." prop is able to give individual styles for entire rows tr, however, I can't seem to find a way to style just specific columns td.

Example:
I have a row with three columns.
I want the middle one to have a green background.
How can I achieve this?

Is there something like a css i can give to the middle column?

<v-data-table :items="items">
<template v-slot:item.name="{ item }"> {{item.name}} </template>
<template v-slot:item.color="{ item }" MY_CUSTOM_CSS="custom-css"> {{item.color}}</template>
<template v-slot:item.age="{ item }"> {{item.age}} </template>
</v-data-table>

Right now only the following will be rendered:

But I would like to have a custom class in addition to the v-data-table__mobile-row like so:

[z0lo13]

@SilasNiewierra

Maybe you already found it but now it is possible with.
:cell-props="(data) => ({ class: custom-css })"