Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Dropdown maxHeight being overridden by something in DataTable [BUG] #2225

Closed
lukeallpress opened this issue Sep 12, 2022 · 3 comments · Fixed by #2892
Closed

Dropdown maxHeight being overridden by something in DataTable [BUG] #2225

lukeallpress opened this issue Sep 12, 2022 · 3 comments · Fixed by #2892
Labels
dash-data-table related to DataTable component

Comments

@lukeallpress
Copy link

lukeallpress commented Sep 12, 2022

Thank you so much for helping improve the quality of Dash!

We do our best to catch bugs during the release process, but we rely on your help to find the ones that slip through.

Describe your context
Please provide us your environment, so we can easily reproduce the issue.

  • replace the result of pip list | grep dash below
dash                      2.6.1              pyhd8ed1ab_0    conda-forge
dash-bootstrap-components 1.0.3              pyhd8ed1ab_0    conda-forge
dash-daq                  0.5.0              pyh9f0ad1d_1    conda-forge
  • if frontend related, tell us your Browser, Version and OS

    • OS: macOS 12.4
    • Browser: Chrome 105

Describe the bug

I can change the maxHeight of the dcc.Dropdown component, but as soon as a DataTable loads (even with no styling) the background of the dropdown shrinks back to 200px and any text below that is left, with a transparent background. If I return a boring Div instead of a DataTable, the dropdown stays styled correctly. Seems to be css-related, because the "incorrect styling" sticks around until I close/reopen the tab, then it's good again until a DataTable loads.

Screenshots

If applicable, add screenshots or screen recording to help explain your problem.
dropdown
Dropdown creation:
dropdown = dcc.Dropdown(options=options, placeholder='Sport', id="sport-dropdown", searchable=False, maxHeight=400, )
DataTable creation

df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')
return dash_table.DataTable(df.to_dict('records'), [{"name": i, "id": i} for i in df.columns])
@T4rk1n T4rk1n added the dash-data-table related to DataTable component label Mar 10, 2023
@pfbuxton
Copy link

pfbuxton commented May 11, 2023

This is not unique to DataTable.

If you have a look at the Dash example: https://dash.plotly.com/dash-core-components/dropdown you can see that "Rome" has a transparent background.

Capture

@nickmelnikov82
Copy link
Member

This error is caused by a special CSS class used for documentation.
A fix is currently under development and will be available soon

@aGitForEveryone
Copy link
Contributor

This issue is also discussed here: #2529

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
dash-data-table related to DataTable component
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants