[10/18] 100%

Курсы §29. Таблицы на CSS
1 
/* Используемые цвета:

#777777
#ffffff
#fffebc
#b2fdd0
#ffbaba

*/

.formula li {
    padding: 5px 5px;
    vertical-align: middle;
    text-align: center;
    border: 1px solid #777777;
}


.formula {
    margin: 10px;
    width: 500px;
    border-collapse: collapse;
}

.formula p {
    margin: 0;
    padding: 10px;
    font-size: 20px;
    text-align: center;
}

.formula {
    display: table;
}

.formula ul {
    display: table-row;
}

.formula li {
    display: table-cell;
}

.formula header {
    display: table-header-group;
}

.formula header li {
    background-color: #ffffff;
}

.formula p {
    display: table-caption;
    caption-side: bottom;
}

.formula .content {
    display: table-row-group;
}

.formula .content-important li {
    background-color: #fffebc;
}


.formula .column-group {
    display: table-column-group;
}

.formula .column {
    display: table-column;
    background-color: #b2fdd0;
}

.formula .column-last {
    background-color: #ffbaba;
}
2

Вот только до конца не разобрался в записи

    <div class="column-group">
        <div class="column"></div>
        <div class="column"></div>
        <div class="column"></div>
    </div>
    <div class="column column-last"></div>

.

.formula .column-group {
    display: table-column-group;
}

.formula .column {
    display: table-column;
    background-color: #b2fdd0;
}

Вот не понимаю зачем обьявлять что .column-group является table-column-group,
совместно еще накидывая что .column является также display: table-column

из курса Колонка таблицы [8/18]

Правила для него будут применяться к первому столбцу, следующий элемент с table-column стилизует второй столбец и так далее.

просто для интереса пытался только оставить запись

.formula .column {
    display: table-column;
    background-color: #b2fdd0;
}

и он этот цвет применял только к первому столбцу.
или это не работает изза обертки?

<div class="column-group"></div>