在Dash Python中设置表元素的样式

Question

非常熟悉Python/Dash，并尝试设置我的表的样式，以便内容垂直显示而不是水平显示（目前是这样），如下所示：

^{tb1}$

理想情况下，所有内容都将垂直显示，并使用样式将标签与其值关联。有人能给我指出这样做的正确方向吗

app.layout = html.Div(children=[
    html.H1('My Dashboard ', style={'font-weight': 'bold', 'text-align': 'left', 'color': 'white', 'backgroundColor': colors['background']}),
    html.H3(' '
            'Customer Interaction Dashboard'
            ' ',
            style={'font-weight': 'bold', 'color': 'grey', 'text-align': 'center',
                   'padding': '10'}),
    html.H1(' '
            ' '
            ' ',
            style={'font-weight': 'bold', 'color': 'grey',
                   'padding': '10'}),

    html.Div([
        html.Div(' '
                 """User ID or Customer Name""",
                 style={'margin-right': '2em', 'margin-left':'6em', 'color': 'grey', 'font-weight': 'bold', 'font-size': '15px', 'padding':
                     '20', 'margin-bottom': '40px'}),

        # dropdown section
        dcc.Dropdown(options=devices, id="input",
                     style={'width': '60%', 'verticalAlign': "middle", 'font-size': '12px', 'padding': '20'}),
    ], style=dict(display='flex')),

    html.Div(children=[
                          html.Div(children=[
                              dash_table.DataTable(
                                  id='profile_table',
                                  columns=[
                                      {"name": ["   Profile Information ", "Name"], "id": "customerName"},
                                      {"name": ["   Profile Information ", "Date of Birth"], "id": "birthDate"},
                                      {"name": ["   Profile Information ", "Email Address"], "id": "EmailAddress"},
                                      {"name": ["   Profile Information ", "Status"], "id": "Active_Status"},
                                      {"name": ["   Profile Information ", "Products"], "id": "productName"}
                                  ],
                                  merge_duplicate_headers=True,
                                  data=[],

                                  style_table={'display': 'inline-block',
                                               'float': 'left',
                                               'margin-right': '100px',
                                               'margin-left': '50px',
                                               'display': 'flex',
                                               'width': '30%',
                                               'border': '2px grey'},
                                  style_as_list_view=True,
                                  style_cell={'padding': '5px',
                                              'fontSize': '18', 'font-family': 'sans-serif', 'textAlign': 'left',
                                              'font-color': 'grey'},
                                  style_header={
                                      'backgroundColor': '#e1e4eb',
                                      'fontWeight': 'bold',

                                      'align': 'center'}
                              ),

                              dash_table.DataTable(
                                  id='table',
                                  columns=[
                                      {"name": ["Timeline"], "id": "EventDate"},
                                      {"name": ["Timeline"], "id": "EventTime"},
                                      {"name": ["Timeline"], "id": "EventClass"},
                                      {"name": ["Timeline"], "id": "Message"},
                                  ],
                                  data=[],
                                  merge_duplicate_headers=True,
                                  style_table={'display': 'inline-block', 'max-width': '600px', 'border': '2px grey',
                                               },
                                  style_as_list_view=True,
                                  style_header={
                                      'backgroundColor': '#e1e4eb',
                                      'fontWeight': 'bold',
                                      'align': 'center'
                                  },
                                  style_cell={
                                      # all three widths are needed
                                      'fontSize': '18', 'font-family': 'sans-serif', 'font-color': 'grey',
                                      'minWidth': '300px', 'width': '300px', 'maxWidth': '600px',
                                      'overflow': 'hidden',
                                      'textOverflow': 'ellipsis',
                                      'textAlign': 'left',
                                  },
                                  style_cell_conditional=[
                                      {'if': {'column_id': 'EventDate'},
                                       'width': '30%'},
                                      {'if': {'column_id': 'EventTime'},
                                       'width': '90px'}
                                      # {'if': {'column_id': 'Pressure'},
                                      # 'width': '130px'},
                                  ],
                                  style_data={

                                      'height': 'auto',
                                      'width': 'auto'
                                  },
                                  style_data_conditional=[
                                      {
                                          'if': {
                                              'filter_query': '{EventClass} = fraudFlag',
                                              'column_id': 'EventClass'
                                          },
                                          'font-color': '#FF4136',
                                          'backgroundColor': '#FF4136',
                                          'color': 'white'
                                      },
                                  ],

                                  sort_mode='multi',
                                  sort_action='native',
                                  sort_by=[{'column_id': 'EventDate', 'column_id': 'EventTime','direction': 'desc'}]

                              )],
                              # style=dict(display='flex')
                              style={'border-color': 'grey', 'border-width': '7px'}
                          ),

                          dcc.Interval(
                              id='interval_component',
                              interval=10000,
                              n_intervals=0,

                          ),
                          html.Div(children=''''''),
                      ] + [html.Div(id="out-all-types")])

])