Content in tabs don't resize correctly

[chriddyp]

Reported in #213 (comment)

and reported with a reproducable example here: https://community.plot.ly/t/graph-in-tab-becomes-gigantic-when-i-click-back-on-first-tab/12468/3

cc @plotly/dash

[chriddyp]

another report here:
https://community.plot.ly/t/bar-chart-squashed-up-after-updating-drop-down/12647/2

we should update the docs with a link to this issue and/or encourage the callback method until this is resolved

[chriddyp]

This has now been documented in https://github.com/plotly/dash-docs/pull/139. So, when this issue is fixed, we should update our documentation

[valentijnnieman]

This was fixed in #279, and published in 0.28.3.

[jchaykow]

@valentijnnieman I just installed 0.28.3 and I'm still having this error. Any updates on this?

[valentijnnieman]

@jchaykow Oh that's annoying! Could you copy paste a reproducible example here?

[jchaykow]

@valentijnnieman this one shows it:

import plotly.plotly as py
import plotly.graph_objs as go

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State

app = dash.Dash()

app.layout = html.Div([
    dcc.Tabs(id="tabs", children=[
        dcc.Tab(label='Tab two', children=[
                            html.Div([
                                html.Div([
                                    dcc.Graph(id = 'graph1')])
                            ], className="four columns"),
                            html.Div([
                                html.Div([
                                    html.Div(id='output-container'), 
                                    dcc.Graph(id = 'graph2',figure = dict(data = [dict(x=0, y=0)], layout = dict(height = 850)))
                                ])
                            ], className="four columns")
                        ]), 
        dcc.Tab(label='Tab three', children=[
                            html.Div([
                                html.Div([
                                    dcc.Graph(id = 'graph4')])
                            ], className="four columns"),
                            html.Div([
                                html.Div([
                                    html.Div(id='output-container1'), 
                                    dcc.Graph(id = 'graph5', figure = dict(data = [dict(x=0, y=0)], layout = dict(height = 850)))
                                ])
                            ], className="four columns")
                        ])
                    ])
                ])

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

Versions:

dash==0.26.5
dash-colorscales==0.0.4
dash-core-components==0.28.3
dash-html-components==0.8.0
dash-renderer==0.11.2

[valentijnnieman]

Thanks @jchaykow!

It looks like something went wrong when merging in master, and the fix was not included. It was probably my fault, I merged and published on a Friday and I was sick with a fever. Apologies! PR #306 should fix it again.

[jchaykow]

@valentijnnieman ah yea, happens to the best of us. Thanks for following up!