Центрирование таблицы с выравниванием текста по центру ⇐ CSS

[Anonymous]

Я хочу центрировать таблицу, но хотя технически она центрирована, из-за разной длины содержимого td справа в таблице остается пустое место.

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

.wrap {
background: pink;
padding: 0 50px;
}

table {
margin: 0 auto;
text-align: center;
width: 100%;
tr {
td {
padding: 10px;
text-align: left;
}
}
}

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

something here
row 1 col 2 my 


row 2 col 1 hello world
react.js

Я могу сделать таблицу и td должен быть выровнен по центру, но из-за разной длины содержимого td оно выглядит неравномерным.

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

.wrap {
background: pink;
padding: 0 50px;
}

table {
margin: 0 auto;
text-align: center;
width: 100%;
tr {
td {
padding: 10px;
}
}
}

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

something here
row 1 col 2 my 


row 2 col 1 hello world
react.js

Я хочу, чтобы содержимое td было выровнено по левому краю и посмотрите по центру оболочки, как метки на этом изображении (например, «Камера 1», «Камера 2» и т. д.):




Подробнее здесь: https://stackoverflow.com/questions/462 ... ign-center