Подскажите что не так?

Прохожу “Испытание: Панель управления”, не могу понять что делаю не так, смотрю на другие сообщения по этому испытанию, написано все так же, но немного другой порядок.

Вот мой код:

.tabs-list {
display: flex;
flex-direction: column;
width: 180px;
margin: 0;
padding: 0;
}

.tab {
margin-bottom: 15px;
align-self: flex-start;
}

.active {
align-self: flex-end;
}

.tab:last-child {
margin: 0;
}

.content {
display: flex;
flex-direction: column;
width: 280px;
padding: 20px 30px;
align-items: center;
margin: 0;
}

.author {
order: -1;
align-self: flex-start;
margin-bottom: 15px;
}

.image {
max-width: 100%;
height: auto;
order: -1;
margin-bottom: 15px;
}

.title {
order: 0;
margin-bottom: 5px;
}

.message {
margin-bottom: 20px;
}

С ним получается такая ситуация:
image
Все отступы согласно тз.

Видел на форуме такой код:

.tabs-list {
width: 180px;
margin:0;
padding:0;
display:flex;
flex-direction: column;
}
.tab {
margin-bottom:15px;
}
.tab:last-child {
margin: 0;
}
.active {
align-self:flex-end;
}

.content {
width:280px;
margin:0;
padding:20px 30px;
display:flex;
flex-direction: column;
align-items:center;
}
.author {
order: -1;
align-self: flex-start;
margin-bottom: 15px;
}
.image {
order: -1;
max-width:100%;
height:auto;
margin:0 0 15px 0;
}
.title{
order: 0;
margin:0 0 5px 0;
}

.message {
margin: 0 0 20px 0;
}

Тут все выполнено на 100%. В упор не могу найти различия :neutral_face:

Ладно, через минуту после поста разобрался.
Видимо нужно вручную убирать везде отступы “margin:0 0 15px 0;”, потому что “margin-bottom: 15px;” выставляет только нижний, остальные задаются браузером :skull_and_crossbones:

можно отступы меж элементов сделать gap ом