Ширина ячейки таблицы больше, чем содержимое ячеек

Я не понимаю, почему ширина ячеек таблицы шире содержимого ячейки.

Я хотел бы, чтобы ширина столбца Artikel была выровнена с содержимым. То, что я уже пробовал, это установить ширину th, но это исправлено и не согласуется с содержимым. Есть ли другое решение?

Мой пример: здесь

введите здесь описание изображения


person FrenkyB    schedule 03.10.2017    source источник
comment
Добавьте класс, показанный в ответе здесь . Это заставит столбец иметь минимально возможную ширину, указанную содержимым этого столбца.   -  person Michael Hancock    schedule 03.10.2017
comment
Я попробовал это на своем примере, и это не работает.   -  person FrenkyB    schedule 03.10.2017


Ответы (1)


Это из-за класса table из bootstrap.min.css, как показано ниже.

.table {
    width: 100%;
    margin-bottom: 20px;
}

Поэтому, если вы удалите класс table, результаты будут такими, какие вам нужны.

Codepen Demo

person Naren Murali    schedule 03.10.2017
comment
Спасибо, это работает. Как сделать ширину таблицы равной 100% и в то же время сделать так, чтобы ширина ячеек соответствовала содержимому? (ширина таблицы должна быть 100% внутри данного div с class='col-sm-12') - person FrenkyB; 03.10.2017
comment
@FrenkyB Если ширина таблицы составляет 100%, то, очевидно, будет дополнительное пространство. просто подумайте об этом, было бы лучше, если бы вы просто центрировали стол, если вам не нужно это пространство! - person Naren Murali; 03.10.2017