Испытание: Панель управления

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

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

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

.content {
display: flex;
flex-direction: column;
align-items: center;
width: 280px;
padding-right: 30px;
padding-left: 30px;
padding-top: 20px;
padding-bottom: 20px;
}

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

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

.title {
order: 2;
margin:0 0 5px 0;

}

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

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

.reply-link {
order: 3;
align-self:center;
margin: 0;
}

Спасибо за помощь!

А что рисует при сравнении? Где не совпадает?

Я вот так делала, 100%.

.dashboard {
display: grid;
grid-template-columns: 180px 280px;
}

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

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

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

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

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

.title {
order: -1;
margin-bottom: 5px;
align-self: center;
margin-top: 0
}

.message {
margin: 0;
}

.reply-link {
align-self: center;
margin-top: 20px;
}

1 лайк



Вот такой результат выдает, хочу просто понять что именно неправильно в моем коде. Вижу что скорее всего с внешними отступами на карточке, но блин все по руководству и все равно где-то ошибка.