How do I use columnCount appropriately in Plotly Dash?

I am trying to create a row containing eight dcc or html elements (so it has eight columns which are evenly separated from each other). Each element contains again one or multiple elements. For example, a html.Div component could contain multiple dcc elements. However, if I add more than two elements in a html.Div component, the hole thing blows up in my face. I've been trying this for two days straight and I'm losing it (because it seems so simple). I already tried every combination with style = {'display': 'inline-block'/'inline'/'block'}, but nothing seems to work.

First example (all good):

import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash(__name__)

app.layout = html.Div([
    html.Div([
        html.Div([  # element 1
            html.Button('Start'),
            dcc.Input(type = 'text'),
            # dcc.Input(type = 'text'),
            # dcc.Input(type = 'text')

        ]),
        html.H6("b"),  # element 2
        html.H6("c"),  # element 3
        html.H6("d"),  # element 4
        html.Div([  # element 5
            dcc.Input(type = 'text'),
            dcc.Input(type = 'text')
        ]),
        html.H6("e"),  # element 6
        html.H6("f"),  # element 7
        html.H6("g"),  # element 8
    ],
        style = {'columnCount': 8}
    )
])

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

It has indeed one row and eight columns as I wished for.

Second example (all bad):

import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash(__name__)

app.layout = html.Div([
    html.Div([
        html.Div([  # element 1
            html.Button('Start'),
            dcc.Input(type = 'text'),
            dcc.Input(type = 'text'),  # I only added
            dcc.Input(type = 'text')  # these two lines

        ]),
        html.H6("b"),  # element 2
        html.H6("c"),  # element 3
        html.H6("d"),  # element 4
        html.Div([  # element 5
            dcc.Input(type = 'text'),
            dcc.Input(type = 'text')
        ]),
        html.H6("e"),  # element 6
        html.H6("f"),  # element 7
        html.H6("g"),  # element 8
    ],
        style = {'columnCount': 8}
    )
])

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

Now it has suddenly two rows and seven columns (whuut).

I want to add as much components in a html.Div element as I want, but still preserve the one row and eight columns. Can please someone enlighten me on this strange phenomenon?