Прохожу “Испытание: Панель управления”, не могу понять что делаю не так, смотрю на другие сообщения по этому испытанию, написано все так же, но немного другой порядок.
Вот мой код:
.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;
}
С ним получается такая ситуация:
Все отступы согласно тз.
Видел на форуме такой код:
.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%. В упор не могу найти различия