Как центрировать элемент?

Frontend developer HTML / CSS
1

Всем привет, мне нужно центрировать нормально заголовки таблицы, без фиксированной ширины, так как называния таблицы будут всё время разные, я делал с использованием фиксированной ширины но когда название маленькое то пробел слишком большой, в общем подскажите путь решения моей проблемы, заранее благодарю.

2

С помощью flexbox решают такую проблему насколько я знаю, вот пример кода:

<div class="wrapper">

    <div class="myText">

        <div class="specialnost">

            Специальность:

        

        <div class="work">

            Программист

        

    





.wrapper {



}

.myText {

    display: flex;

    flex-direction: row;

    flex-wrap: nowrap;

    justify-content: center;

}

.specialnost,

.work {

    padding: 5px 10px;

}

.specialnost {

    padding-right: 3px;

}

Таким образом всё будет позиционироватся по центру и с одинаковыми отступами)

3

Можно центрировать и без флексов. Через свойство position и transform - это больше вариант подойдёт, если не знаешь размеры элементов.