SNPR
1
Здравствуйте! Подскажите пожалуйста, что я делаю не так? Дальше 98% уйти не получается.
.palette {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: flex-end;
flex-wrap: wrap-reverse;
padding: 14px 0 13px 0;
}
.color-1 {
align-self: flex-start;
order: 1; /* тёмно-синий */
}
.color-2 {
order: -5; /* light-blue */
}
.color-3 {
order: -10; /* green */
}
.color-4 { /* yellow */
order: -6 ;
}
.color-5 {
order: -9; /* бордовый */
}
.color-6 {
order: -7; /* светло-фиолетовый */
}
.color-7 {
order: -8; /* фиолетовый */
}
SNPR
2
Немного схитрил и достиг 100%, но ведь это явно не то, что нам нужно?
.palette {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: flex-end;
flex-wrap: wrap-reverse;
padding: 14px 0 13px 0;
}
.color-1 {
position: absolute;
top: -1px;
align-self: flex-start;
margin-left: 1000px;
order: 1; /* тёмно-синий */
}
.color-2 {
order: -5; /* light-blue */
}
.color-3 {
order: -10; /* green */
}
.color-4 { /* yellow */
order: -6 ;
}
.color-5 {
order: -9; /* бордовый */
}
.color-6 {
order: -7; /* светло-фиолетовый */
}
.color-7 {
order: -8; /* фиолетовый */
}
SNPR
3
Понял
.palette {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
flex-wrap: wrap-reverse;
}
.color-1 {
align-self: flex-start;
order: 1; /* тёмно-синий */
}
.color-2 {
order: -5; /* light-blue */
}
.color-3 {
order: -10; /* green */
}
.color-4 { /* yellow */
order: -6 ;
}
.color-5 {
order: -9; /* бордовый */
}
.color-6 {
order: -7; /* светло-фиолетовый */
}
.color-7 {
order: -8; /* фиолетовый */
}