How to keep Dash DataTable header's style when printing

Dash Python
1

I’m trying to make a Dash DataTable and styled header for it but when printing, all styles for header disappeared. Below is my sample code:

from dash import Dash, dash_table
import pandas as pd
from collections import OrderedDict

data = OrderedDict(
    [
        ("Date", ["2015-01-01", "2015-10-24", "2016-05-10", "2017-01-10", "2018-05-10", "2018-08-15"]),
        ("Region", ["Montreal", "Toronto", "New York City", "Miami", "San Francisco", "London"]),
        ("Temperature", [1, -20, 3.512, 4, 10423, -441.2]),
        ("Humidity", [10, 20, 30, 40, 50, 60]),
        ("Pressure", [2, 10924, 3912, -10, 3591.2, 15]),
    ]
)

df = pd.DataFrame(data)

app = Dash(__name__)

app.layout = dash_table.DataTable(
    data=df.to_dict('records'),
    columns=[{'id': c, 'name': c} for c in df.columns],
    style_cell={'textAlign': 'left'},
    style_header={'backgroundColor':'#305D91','color':'#FFFFFF'}

)

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

Below is the result:

Screenshot 2022-12-05 093408
Screenshot 2022-12-05 0934081917×227 6.82 KB

But when printing used Ctrl + P, header color disappeared:

Screenshot 2022-12-05 093519
Screenshot 2022-12-05 0935191913×345 30.5 KB

How can I fix this one. Thank you.

2

Hey @hoatran,

I think this is a setting in chrome, when printing, make sure under the settings that you have something along the lines of background images ticked.

2 Likes
3

Thank you, I chose Background graphics when printing and it worked.

1 Like