Ни один из элементов пользовательского интерфейса материала не выровнен по вертикали

Question

Я использую Material UI с React, и куда бы я ни поместил элемент <Typography>, он дает слишком большую высоту или неправильно выравнивает текст внутри него. Вот несколько картинок в качестве примеров:

Вот пример использования от одного из моих экранов:

<Typography onClick={() => _redirect("/")} variant="h6" className={classes.title}>
    Boardee
</Typography>

classes.title содержит только cursor: pointer внутри.

Это довольно странная «ошибка». Не уверен, что с этим делать.