# Datatable style issue - fixed\_columns

**URL:** <https://community.plotly.com/t/datatable-style-issue-fixed-columns/74697>\
**Category:** Dash Python\
**Tags:** question\
**Created:** [April 24, 2023, 12:08pm UTC](https://community.plotly.com/t/datatable-style-issue-fixed-columns/74697 "2023-04-24T12:08:20Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![aboh](https://avatars.discourse-cdn.com/v4/letter/a/a87d85/32.png) [@aboh](https://community.plotly.com/u/aboh)\
**Post date:** [April 24, 2023, 12:08pm UTC](https://community.plotly.com/t/datatable-style-issue-fixed-columns/74697/1 "2023-04-24T12:08:20Z")

</div>

Hi there! I’ve been experiencing some issues with DataTable formatting when using fixed columns.

Specifically, I have noticed an issue with the Plotly table component where the column width overlaps other non-fixed column after a callback update (new data).

```auto
dash_table.DataTable(
.
.
.
    fixed_columns={'headers': True, 'data': 1},
    style_table={'minWidth': '100%', 'overflowX': 'scroll', 'height': '150px',
                 'overflowY': 'scroll'},
    style_cell={'width': '50px'},
    style_cell_conditional={'if': {'column_id': Date},
                                 'width': '100px',
                                 'minWidth': '100px',
                                 'maxWidth': '100px',
                                 },
    },

```

Basically it goes from this (expected behavior)…  
 ![image](https://us1.discourse-cdn.com/flex024/uploads/plot/original/3X/9/2/9299b168cfd85d7441faee9d2413171903f1e856.png)

…to this after a callback:  
 ![image](https://us1.discourse-cdn.com/flex024/uploads/plot/original/3X/b/b/bb81a9cf22f9f9aca5aee9713865a94f828a335e.png)

This issue only occurs when fixed\_columns is used. If I remove **fixed\_column** property, the bug also disappears!

Additionally, I have tried many different solutions to fix this issue, such as setting the column width with relative or absolute numbers, both in the callback and initially, but none of them resolved the problem.

Cheers

---

<div class="post-metadata">

**Author:** ![AnnMarieW](https://avatars.discourse-cdn.com/v4/letter/a/ec9cab/32.png) [@AnnMarieW](https://community.plotly.com/u/AnnMarieW)\
**Post date:** [April 24, 2023, 1:25pm UTC](https://community.plotly.com/t/datatable-style-issue-fixed-columns/74697/2 "2023-04-24T13:25:26Z")

</div>

Hi @aboh and welcome to the Dash community 🙂

There are quite a few open issues with fixed rows and fixed columns in the DataTable

I recommend you give dash-ag-grid a try. Not only can you set the which rows/columns are fixed, the user can also do that by dragging the column.

![ag_grid_pinning](https://us1.discourse-cdn.com/flex024/uploads/plot/original/3X/c/a/ca9c1db75992afa8c37de999f368d151f29a0be4.gif)

Find more info here:

> **[Dash AG Grid Column Definitions](https://dashaggrid.pythonanywhere.com/columns/column-pinning)**
>
> Dash AG Grid documentation -- Alpha release

---

<div class="post-metadata">

**Author:** ![aboh](https://avatars.discourse-cdn.com/v4/letter/a/a87d85/32.png) [@aboh](https://community.plotly.com/u/aboh)\
**Post date:** [April 26, 2023, 11:19am UTC](https://community.plotly.com/t/datatable-style-issue-fixed-columns/74697/3 "2023-04-26T11:19:10Z")

</div>

Hi @AnnMarieW, thanks for your warm welcome and suggestion. I’ll take a look.
