Add borders to the table - python dash

Dash Python
1

Is there any way to add borders to the table. What should I add to the following code.

html.Table(className='reaponsive-table',
					children=[
						html.Thead(
							html.Tr(
								children=[html.Th(col.title()) for col in imp_df.columns.values]
							)
						),
						html.Tbody([
							html.Tr(
								children=[html.Td(data) for data in d]
							)
						for d in imp_df.values.tolist()])
					])
2

Hi,

Dash generate HTML, and as you have a class ‘reaponsive-table’, you can simply add CSS to it. See for instance the following CSS:

.reaponsive-table {
  border: solid;
}
.reaponsive-table td {
  border: solid;
  border-width: 0.2px;
}

.reaponsive-table tr:hover {
  background-color: yellow;
}

.reaponsive-table td:hover {
  background-color: red;
}

It produces the following table:

table_border
table_border.png561×666 72.5 KB

To include CSS, see the docs: https://dash.plot.ly/external-resources

GwendalD

2 Likes
3

Hey! Thanks a lot. It worked well.

1 Like