Custom CSS styles not applied to specific columns

💬 App Building
2

Hello @Timur_Tuhtaev,

I checked the issue and have a solution. Instead of targeting column names, you can style the table using column numbers — this works effectively in Retool tables. Here’s an example along with a screenshot and CSS:

[data-testid="table11"] [role=""]:nth-child(1),
[data-testid="table11"] [role="gridcell"]:nth-child(1) {
  background: #f5f5f5 !important;
}

[data-testid="table11"] [role=""]:nth-child(3),
[data-testid="table11"] [role="gridcell"]:nth-child(3) {
  background: #f5f5f5 !important;
}

[data-testid="table11"] [role=""]:nth-child(7),
[data-testid="table11"] [role="gridcell"]:nth-child(7) {
  background: #f5f5f5 !important;
}

image
image1632×659 136 KB

Note: According to the Retool team, custom CSS isn’t always the most reliable or durable solution. You can check out their explanation in this community post:
:link: https://community.retool.com/t/increasing-border-thickness-of-table-cells-and-containers/61056/16

1 Like