Помогите найти ошибку 10/18

[Vladimr_Lobochkin]

Не могу понять , что я делаю не так

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

.formula p {
display: table-caption;
caption-side: bottom;
text-align: center;
margin: 0;
padding: 10px;
font-size: 20px;
}

ul {
display: table-row;
list-style: none;

}

li {
display: table-cell;
text-align: center;
vertical-align: middle;
border: 1px solid #777777;
padding: 5px 0px;
}

header {
display: table-header-group;
background-color: #ffffff;
}

.content {
display: table-row-group;
background-color: #b2fdd0;
}

.content-important {
display: table-footer-group;
background-color: #fffebc;
}

.column {
display: table-column;
}

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

[Ineska]

Не сгруппировали колонки:
.column-group { display: table-column-group; }
И в зеленый цвет красить нужно эту группу.
Оставшийся недочет касается внутренних отступов у li, они должны быть прописаны с каждой стороны, а не только сверху и снизу.

[Vladimr_Lobochkin]

Ничего не поменялось

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

.formula p {
display: table-caption;
caption-side: bottom;
text-align: center;
margin: 0;
padding: 10px;
font-size: 20px;
}

ul {
display: table-row;
list-style: none;

}

li {
display: table-cell;
text-align: center;
vertical-align: middle;
border: 1px solid #777777;
padding: 5px 30px;
}

header {
display: table-header-group;
background-color: #ffffff;
}

.content {
display: table-row-group;

}

.content-important {
display: table-footer-group;
background-color: #fffebc;
}

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

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

[Ineska]

Вы не внимательны. На счет того, чтобы удалить это правило, написано ничего не было:
.column {
display: table-column;
}

[Vladimr_Lobochkin]

Большое спасибо ! )

Но что то не то наверно с отступами

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

.formula p {
display: table-caption;
caption-side: bottom;
text-align: center;
margin: 0;
padding: 10px;
font-size: 20px;
}

ul {
display: table-row;
list-style: none;

}

li {
display: table-cell;
text-align: center;
vertical-align: middle;
border: 1px solid #777777;
padding: 5px 25px;
}

header {
display: table-header-group;
background-color: #ffffff;
}

.content {
display: table-row-group;

}

.content-important {
display: table-footer-group;
background-color: #fffebc;
}

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

.column {
display: table-column;
}

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

[Ineska]

Отступы одинаковые с каждой стороны - по 5px.

[Vladimr_Lobochkin]

Спасибо, никогда бы не догадался ? )

[LeonoraG]

подскажите плиз что потеряла:

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

.formula p {display:table-caption;
caption-side: bottom;
text-align:center;
margin: 0;
padding: 10px;
font-size: 20px;}

.formula ul {display:table-row;}

.formula li {display:table-cell;}

.formula header {display:table-header-group;
background-color:#ffffff;}

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

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

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

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

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

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

.formula header li {border:1px solid #777777;
border-bottom:none;
text-align:center;
padding:5px;}

[Ineska]

Вертикальное выравнивание внутри ячеек.

[LeonoraG]

Не помогло))

[Ineska]

https://webref.ru/css/vertical-align

[LeonoraG]

Спасибо!