Dash AG Grid autoheight doesn't work

Can anyone see the problem here? My Data Grid always has a huge white chin below it.

grid = dag.AgGrid(
    id="grid",
    className="ag-theme-material border",
    rowData=df.to_dict("records"),
    columnDefs=columnDefs,
    columnSize="sizeToFit",
    dashGridOptions={"domLayout": "autoHeight", "columnHoverHighlight": True, "rowSelection":"single"}

Hello @subodhpokhrel7,

You need to adjust the style of the div that is around it as well.

The default height is 400px. Change this to something like 100% or fit-content.

Hi @jinnyzor ,

I have added style={'height':'100%'} to everywhere possible. But it doesn’t seem to work

html.Div(
        dcc.Loading(
            children =[html.Div(html.Div(id='usn_output', style={'height':'100%'}), style={'height':'100%'})],
            type="default",
            color="black",
            style={'height':'100%'}            
        ),style={'height':'100%'}
    ),

Hmm,

I don’t see the grid anywhere in the example you posted.

The style argument needs to go onto the grid itself.

1 Like