This repository was archived by the owner on Aug 29, 2025. It is now read-only.
This repository was archived by the owner on Aug 29, 2025. It is now read-only.
Description
The first render is OK, but resizing causes width mismatch between headers & cells.
import dash import dash_table import dash_html_components as html import pandas as pd app = dash.Dash(__name__) df = pd.DataFrame({ 'Column 1': 10 * ['Alpha Alpha Alpha Alpha', 'Beta Beta', 'Bananna Bananna', 'Cucumber Cucumber', 'Dynosaur Dynosaur'], 'Column 2': 10 * ['Alpha', 'Beta', 'Bananna', 'Cucumber', 'Dynosaur'], 'Column 3': 10 * ['Alpha', 'Beta', 'Bananna', 'Cucumber', 'Dynosaur'], 'Column 4': 10 * ['Alpha', 'Beta', 'Bananna', 'Cucumber', 'Dynosaur'], 'Column 5': 10 * ['Alpha', 'Beta', 'Bananna', 'Cucumber', 'Dynosaur'], 'Column 6': 10 * ['Alpha', 'Beta', 'Bananna', 'Cucumber', 'Dynosaur'], }) app.layout = html.Div([ html.Div(style={'width': '30%', 'height': 20, 'backgroundColor': 'hotpink'}), dash_table.DataTable( data=df.to_dict('records'), columns=[{'id': c, 'name': c} for c in df.columns], fixed_rows={'headers': True}, style_cell={ 'textOverflow': 'ellipsis', 'overflow': 'hidden' }, style_cell_conditional=[{ 'if': {'column_id': 'Column 1'}, 'width': '30%' }] ) ]) if __name__ == '__main__': app.run_server(debug=True)
