Hello all~
I have been using markdown in my datatable, and have had issue applying styling that doesn’t seem to get passed to the cells with markdown. In particular, I am just seeking to center the text. This works fine for all non-markdown cells, and I’ve seen this has been raised previously without a clear path forward below:
Attaching an image of the styling not applying to the markdown link in the left-most column
Here is the code I am using to generate the table, with center align applied everywhere (to data, header, and cell)
return dash_table.DataTable(
id='datatable',
columns=[
{"name": "Ticker", "id": "ticker", 'type': 'text', 'presentation': 'markdown'},
{"name": "Initial Date Est.", "id": "date"},
{"name": "Watchlist(s)", "id": "grouping", "editable": True},
{"name": "Notes", "id": "notes", "editable": True},
{"name": "Latest Price ($)", "id": "price", 'type': 'numeric', 'format': FormatTemplate.money(2)},
{"name": "Change (30d)", "id": "change", 'type': 'numeric', 'format': FormatTemplate.percentage(2).sign(Sign.positive)},
{"name": "Market Cap ($)", "id": "market_cap"},
{"name": "Price Chart", "id": "chart",
'type': 'text', 'presentation': 'markdown'},
],
data=watchlist_dict,
css=[{'selector': '.row', 'rule': 'margin: 0'}],
filter_action="native",
sort_action="native",
style_as_list_view=True,
style_cell={
'fontSize': 17,
'padding': '10px',
'textAlign': 'center'
},
style_header={
'font-family': 'arial',
'fontSize': 15,
'fontWeight': 'bold',
'textAlign': 'center'
},
style_data={
'textAlign': 'center',
'fontWeight': 'bold',
'font-family': 'Roboto',
'fontSize': 15,
},
# scrollable for small viewports
style_table={
'overflowX': 'auto',
},
sort_mode="single",
column_selectable="single",
row_deletable=True,
selected_columns=[],
selected_rows=[],
page_action="native",
page_current=0,
page_size=100,
)
Any help would be greatly appreciated!
Thanks in advance,
-Daniel
2 posts - 2 participants
