Организм бунтует! Что в коде?

Курсы §29. Таблицы на CSS
1

100% есть.

Но 69px…

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

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

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

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

ul {
display: table-row;
}

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

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

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

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

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

2

Может особенность браузера, с кодом вроде все красиво.

3

я ожидал, что вообще задавать ширину не буду. получилось только 93%, пару пикселей нарушало гармонию. только ручным добором ширину подогнал. но все же думаю, фишка есть, как сделать резиновую ширину

4

хм все просто оказалось, уберите ширину, и задайте padding 5px а не 5px 0

5

пффф…)) спасибо!