align-self

align-items:normal
◆align-self:auto
.align-items_normal{
display:flex;
align-items:normal;
}
.align-self_auto{
align-self:auto;
}
1
2
3
4
5

◆align-self:normal
.align-items_normal{
display:flex;
align-items:normal;
}
.align-self_normal{
align-self:normal;
}
1
2
3
4
5

◆align-self:self-start
.align-items_normal{
display:flex;
align-items:normal;
}
.align-self_self-start{
align-self:self-start;
}
1
2
3
4
5

◆align-self:self-end
.align-items_normal{
display:flex;
align-items:normal;
}
.align-self_self-end{
align-self:self-end;
}
1
2
3
4
5

◆align-self:flex-start
.align-items_normal{
display:flex;
align-items:normal;
}
.align-self_flex-start{
align-self:flex-start;
}
1
2
3
4
5

◆align-self:flex-end
.align-items_normal{
display:flex;
align-items:normal;
}
.align-self_flex-end{
align-self:flex-end;
}
1
2
3
4
5

◆align-self:center
.align-items_normal{
display:flex;
align-items:normal;
}
.align-self_center{
align-self:center;
}
1
2
3
4
5

align-items:flex-start
◆align-self:auto
.align-items_flex-start{
display:flex;
align-items:flex-start;
}
.align-self_auto{
align-self:auto;
}
1
2
3
4
5

◆align-self:normal
.align-items_flex-start{
display:flex;
align-items:flex-start;
}
.align-self_normal{
align-self:normal;
}
1
2
3
4
5

◆align-self:self-start
.align-items_flex-start{
display:flex;
align-items:flex-start;
}
.align-self_self-start{
align-self:self-start;
}
1
2
3
4
5

◆align-self:self-end
.align-items_flex-start{
display:flex;
align-items:flex-start;
}
.align-self_self-end{
align-self:self-end;
}
1
2
3
4
5

◆align-self:flex-start
.align-items_flex-start{
display:flex;
align-items:flex-start;
}
.align-self_flex-start{
align-self:flex-start;
}
1
2
3
4
5

◆align-self:flex-end
.align-items_flex-start{
display:flex;
align-items:flex-start;
}
.align-self_flex-end{
align-self:flex-end;
}
1
2
3
4
5

◆align-self:center
.align-items_flex-start{
display:flex;
align-items:flex-start;
}
.align-self_center{
align-self:center;
}
1
2
3
4
5

align-items:flex-end
◆align-self:auto
.align-items_flex-end{
display:flex;
align-items:flex-end;
}
.align-self_auto{
align-self:auto;
}
1
2
3
4
5

◆align-self:normal
.align-items_flex-end{
display:flex;
align-items:flex-end;
}
.align-self_normal{
align-self:normal;
}
1
2
3
4
5

◆align-self:self-start
.align-items_flex-end{
display:flex;
align-items:flex-end;
}
.align-self_self-start{
align-self:self-start;
}
1
2
3
4
5

◆align-self:self-end
.align-items_flex-end{
display:flex;
align-items:flex-end;
}
.align-self_self-end{
align-self:self-end;
}
1
2
3
4
5

◆align-self:flex-start
.align-items_flex-end{
display:flex;
align-items:flex-end;
}
.align-self_flex-start{
align-self:flex-start;
}
1
2
3
4
5

◆align-self:flex-end
.align-items_flex-end{
display:flex;
align-items:flex-end;
}
.align-self_flex-end{
align-self:flex-end;
}
1
2
3
4
5

◆align-self:center
.align-items_flex-end{
display:flex;
align-items:flex-end;
}
.align-self_center{
align-self:center;
}
1
2
3
4
5

align-items:center
◆align-self:auto
.align-items_center{
display:flex;
align-items:center;
}
.align-self_auto{
align-self:auto;
}
1
2
3
4
5

◆align-self:normal
.align-items_center{
display:flex;
align-items:center;
}
.align-self_normal{
align-self:normal;
}
1
2
3
4
5

◆align-self:self-start
.align-items_center{
display:flex;
align-items:center;
}
.align-self_self-start{
align-self:self-start;
}
1
2
3
4
5

◆align-self:self-end
.align-items_center{
display:flex;
align-items:center;
}
.align-self_self-end{
align-self:self-end;
}
1
2
3
4
5

◆align-self:flex-start
.align-items_center{
display:flex;
align-items:center;
}
.align-self_flex-start{
align-self:flex-start;
}
1
2
3
4
5

◆align-self:flex-end
.align-items_center{
display:flex;
align-items:center;
}
.align-self_flex-end{
align-self:flex-end;
}
1
2
3
4
5

◆align-self:center
.align-items_center{
display:flex;
align-items:center;
}
.align-self_center{
align-self:center;
}
1
2
3
4
5

align-items:start
◆align-self:auto
.align-items_start{
display:flex;
align-items:start;
}
.align-self_auto{
align-self:auto;
}
1
2
3
4
5

◆align-self:normal
.align-items_start{
display:flex;
align-items:start;
}
.align-self_normal{
align-self:normal;
}
1
2
3
4
5

◆align-self:self-start
.align-items_start{
display:flex;
align-items:start;
}
.align-self_self-start{
align-self:self-start;
}
1
2
3
4
5

◆align-self:self-end
.align-items_start{
display:flex;
align-items:start;
}
.align-self_self-end{
align-self:self-end;
}
1
2
3
4
5

◆align-self:flex-start
.align-items_start{
display:flex;
align-items:start;
}
.align-self_flex-start{
align-self:flex-start;
}
1
2
3
4
5

◆align-self:flex-end
.align-items_start{
display:flex;
align-items:start;
}
.align-self_flex-end{
align-self:flex-end;
}
1
2
3
4
5

◆align-self:center
.align-items_start{
display:flex;
align-items:start;
}
.align-self_center{
align-self:center;
}
1
2
3
4
5

align-items:end
◆align-self:auto
.align-items_end{
display:flex;
align-items:end;
}
.align-self_auto{
align-self:auto;
}
1
2
3
4
5

◆align-self:normal
.align-items_end{
display:flex;
align-items:end;
}
.align-self_normal{
align-self:normal;
}
1
2
3
4
5

◆align-self:self-start
.align-items_end{
display:flex;
align-items:end;
}
.align-self_self-start{
align-self:self-start;
}
1
2
3
4
5

◆align-self:self-end
.align-items_end{
display:flex;
align-items:end;
}
.align-self_self-end{
align-self:self-end;
}
1
2
3
4
5

◆align-self:flex-start
.align-items_end{
display:flex;
align-items:end;
}
.align-self_flex-start{
align-self:flex-start;
}
1
2
3
4
5

◆align-self:flex-end
.align-items_end{
display:flex;
align-items:end;
}
.align-self_flex-end{
align-self:flex-end;
}
1
2
3
4
5

◆align-self:center
.align-items_end{
display:flex;
align-items:end;
}
.align-self_center{
align-self:center;
}
1
2
3
4
5

align-items:self-start
◆align-self:auto
.align-items_self-start{
display:flex;
align-items:self-start;
}
.align-self_auto{
align-self:auto;
}
1
2
3
4
5

◆align-self:normal
.align-items_self-start{
display:flex;
align-items:self-start;
}
.align-self_normal{
align-self:normal;
}
1
2
3
4
5

◆align-self:self-start
.align-items_self-start{
display:flex;
align-items:self-start;
}
.align-self_self-start{
align-self:self-start;
}
1
2
3
4
5

◆align-self:self-end
.align-items_self-start{
display:flex;
align-items:self-start;
}
.align-self_self-end{
align-self:self-end;
}
1
2
3
4
5

◆align-self:flex-start
.align-items_self-start{
display:flex;
align-items:self-start;
}
.align-self_flex-start{
align-self:flex-start;
}
1
2
3
4
5

◆align-self:flex-end
.align-items_self-start{
display:flex;
align-items:self-start;
}
.align-self_flex-end{
align-self:flex-end;
}
1
2
3
4
5

◆align-self:center
.align-items_self-start{
display:flex;
align-items:self-start;
}
.align-self_center{
align-self:center;
}
1
2
3
4
5