Как выравнивать по центру вкладки пользовательского интерфейса jQuery - с скриншотом

Кто-нибудь, пожалуйста, знайте, как выровнять по центру вкладки в вкладках jQuery UI?

(Они по умолчанию выровнены по левому краю, и я не могу найти параметр выравнивания в документе doc)

Вот страница, где я использую ее для группировки некоторых диаграмм, а текущий код просто:

    $('#chart_tabs').tabs();

UPDATE: Код CSS:

    .ui-tabs .ui-tabs-nav {
            text-align: center;
    }

    .ui-tabs .ui-tabs-nav li {
            float: none !important;
            display: inline-block;
    }

предложенный Дидье (спасибо), выровнял по центру вкладки, но также добавил некоторый странный зазор под вкладкой "кнопки":

Ответ 1

Это отрезало мне помощь в те дни.

.centered .ui-tabs-nav {
    height: 2.35em;
    text-align: center;
}
.centered .ui-tabs-nav li {
    display: inline-block;
    float: none;
    margin: 0em;
}

возможно, это тоже работает для вас.

Ответ 2

Самый простой способ - применить text-align: center к контейнеру (элемент UL) и развернуть LI:

.ui-tabs .ui-tabs-nav {
    text-align: center;
}

.ui-tabs .ui-tabs-nav li {
    float: none !important;
    display: inline-block;
}

Ответ 3

Это работало для меня и избегало пробела (под вкладками), о котором вы говорили:

.ui-tabs-nav {
  float: none; text-align: center;  
}

.ui-tabs-nav li {
  display: inline-block; float: none;  
}

.ui-tabs-nav li a {
  float: none;
}