"table-layout: fixed" does not work with fixed_rows // ability to force fixed column width with fixed_rows #748

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'],
})

WIDTH = '10%'
app.layout = html.Div([
    html.Div(
        children='20% Width',
        style={
            'color': 'white',
            'width': WIDTH,
            '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},
        css=[{'selector': 'table', 'rule': 'table-layout: fixed'}],
        style_cell={
            'textOverflow': 'ellipsis',
            'overflow': 'hidden'
        },
        style_cell_conditional=[{
            'if': {'column_id': 'Column 1'},
            'width': WIDTH,
        }]
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)