Placing two divs next to each

Dash Python
1

Hi,

I want to place the red result next to the blue one. I tried to wrap both divs into a column and use style={'display':'flex'}

Unfortunately this did not work.

How can I modify the code to get red and blue next to each other? Thank you!

grafik

html.Div([
        html.H6('', style={"height": "2px", 'margin-top': '12px', 'margin-bottom':'12px', 'justyfy-content': 'center'}),
        html.Div(id='dropdown-container', children=[]),
        dbc.Col([html.Div(id='GK_gesamt_gwp', style={'color':'red'}),
        html.Div(id='Transport_gesamt_gwp2', style={'color':'blue'}),], style={'display':'flex'}),
        html.Div(id='dropdown-container-output1'),
        html.Button("+", id="add-filter", n_clicks=0),
])
2

The dbcCol should probably be inside a dbc.Row

dbc.Row([
    dbc.Col(html.Div(id='GK_gesamt_gwp', style={'color':'red'})),
    dbc.Col(html.Div(id='Transport_gesamt_gwp2', style={'color':'blue'}))
])
2 Likes
3

Span could work, but I think it would need to be:

html.Div([
    html.Span(id='GK_gesamt_gwp', style={'color':'red'}),
    html.Span(id='Transport_gesamt_gwp2', style={'color':'blue'})
])
2 Likes