Проблема с выравниванием флажков Vue.js: центрирование флажков внутри ячеек таблицы ⇐ CSS

[Anonymous]

Я столкнулся с проблемой выравнивания флажков в приложении Vue.js. Я пытаюсь центрировать флажки в соответствующих ячейках таблицы. По умолчанию они выравниваются по левому краю. После применения стиля CSS к ячейке все флажки неожиданно выравниваются вертикально по центру крайнего левого столбца таблицы, а не остаются по центру своих ячеек. Как устранить это несоответствие выравнивания?

Код: Выделить всё

{{ role }}






{{ character.name }}

Код: Выделить всё

.checkbox-cell {
display: flex;
justify-content: center;
align-items: center;
}

Спасибо за любую помощь

Подробнее здесь: https://stackoverflow.com/questions/782 ... able-cells