How to change dash table tooltip size

Dash Python
#1

I want to change dash table tooltip width.
I tried to use custom css, but did not work.

assets/custom_css.css
.dash-tooltip .dash-table-tooltip {
max-width: 200px;
min-width: 100px;
}

I also tried to use dash_table.css option

dash_table.DataTable(
…
css=[{‘selector’: ‘dash-table-tooltip’, ‘rule’: ‘max-width: 200px; min-width: 100px;’}],
…)

How can I change dash table tooltip style?

Style Datatable tooltip_conditional
#2

Same problem here, could you figure it out?

#3

Okay nevermind, I finally found it!

It’s pretty simple actually, you just have to override both the width and the max-width property on .dash-table-tooltip, and remember to add !important so they get precedence.

This is the related file from the tooltips PR where you can see the default styles: https://github.com/plotly/dash-table/pull/338/files#diff-02b1c6154ad8311a2face953de21380d

1 Like