Добиться центрирования легко. В сетке из 24 столбцов вы можете использовать компонент Col и поэкспериментировать с числами диапазона, чтобы убедиться, что ширина одинакова слева и справа. Например, это все настройки столбца, которые позволят вам центрироваться:
<Col span={12} offset={6}><Col span={10} offset={7}><Col span={8} offset={8}><Col span={6} offset={8}>
Просто выберите диапазон, который является номером события, и смещение равно (24 - диапазон) / 2.
Проблема заключается в максимальной ширине: 200 пикселей. Чтобы ограничить максимальную ширину значением, независимо от того, какой у него размер экрана, я боюсь, что вам придется написать для него пользовательский CSS просто потому, что нет ничего, что могло бы дать вам указанное значение c без вы указываете, что это значение.
В этом случае я предлагаю создать одну строку и один столбец, охватывающий всю строку, и использовать flex для центрирования вашего элемента:
<Col span={24}>
<div style="display: 'flex'; justify-content: 'center';">
<div style="flex: 1; max-width: '200px'">
</div>
</div>
</Col>