Как выровнять столбцы в bootstrap - vue таблице? - PullRequest
0 голосов
/ 16 января 2020

Использование https://bootstrap-vue.js.org/docs/components/table в vue / cli / "bootstrap - vue": "^ 2.1.0" Я не нашел, как установить выравнивание для всех столбцов и изменить его для любого колонка. Я пробовал как:

<b-card-body>
        <b-table responsive="sm" striped hover small :items="users" :fields="usersFields" align-v="end">
            <template v-slot:cell(id)="data">
                <div class="-align-right">{{ data.value }}</div>
            </template>

            <template v-slot:cell(status)="data"  >
                <div class="-align-left">{{ getDictionaryLabel( data.value, userStatusLabels ) }}</div>
            </template>

Но не удалось, так как все столбцы центрированы.

Как правильно?

1 Ответ

1 голос
/ 16 января 2020

Класс -align-right и -align-left недопустимы Bootstrap v4 CSS имена классов. Классы выравнивания текста Bootstrap:

  • text-right
  • text-left
  • text-center

См. https://getbootstrap.com/docs/4.4/utilities/text/#text -alignment

...