Как создать следующий заголовок пользовательского интерфейса с помощью ReactJS, CSS и начальной загрузки? ⇐ Javascript

[Гость]

Я хочу разработать следующий тип адаптивного дизайна в ReactJS с использованием Bootstrap или CSS (при необходимости). Это не заголовок. Как мне разместить разделители между каждым столбцом и сделать значения каждой метки в следующей строке в том же столбце, используя Bootstrap или CSS Flexbox? Мне нужно, чтобы оно располагалось на одинаковом расстоянии и должно было реагировать таким образом, чтобы при изменении размера окна браузера оно не переполнялось. Все элементы в каждом столбце выравниваются по левому краю.

Код песочницы –





Дизайн пользовательского интерфейса –