Problem

When upgrading Dash to v1.0.0 and Dash table (from 3.7.0) to 4.0.0, tables stop to auto-expand horizontally. In other words, they act as "<span>" instead of "<p>".

with dash_table 3.7.0

with dash_table 4.0.0

The issue seems to come from the <table> HTML element. Indeed, its <div class="cell cell-1-1 dash-fixed-content"> container expands to the full width of it's own parent. So if you manually set width: 100% to the <table> element, it works as expected.

However, it would be great to do this through the source code.
But, unlike what is detailed here, the css attribute throws an error:

dash_table.DataTable(
    id='table',
    data=df.to_dict("rows"),
    columns=[{"name": i, "id": i} for i in df.columns],
    css={
        'width': '100%',
    },
),

and the style_table doesn't solve the issue:

dash_table.DataTable(
    id='table',
    data=df.to_dict("rows"),
    columns=[{"name": i, "id": i} for i in df.columns],
    style_table={
        'width': '100%',
    },
),

Question(s)

Is it an expected behaviour?

If so, how to make table full (container's) width again?

MWE

requirements for dash_table 3.7.0

dash-core-components==0.39.0
dash-html-components==0.13.2
dash-renderer==0.15.1
dash-table==3.7.0
dash==0.31.1
datetime
pandas==0.23.4
plotly==3.4.1

requirements for dash_table 4.0.0

dash_renderer==1.0.0
dash-core-components==1.0.0
dash-html-components==1.0.0
dash-table==4.0.0
dash==1.0.0
pandas==0.24.2
plotly==3.10.0

test app

import dash
import dash_table
import dash_html_components as html
import pandas as pd

df = pd.read_csv(
    'https://raw.githubusercontent.com/plotly/datasets/master/gapminder2007.csv'
)

app = dash.Dash(__name__)

app.layout = html.Div(
    [
        html.P(
            "foobar",
            style = {
                'background': 'cyan',
                'padding': '10px'
            }
        ),
        dash_table.DataTable(
            id='table',
            data=df.to_dict("rows"),
            columns=[{"name": i, "id": i} for i in df.columns],
        ),
    ],
    style = {
        'background': 'red',
        'padding': '10px'
    }
)


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