In the flex column layout, the align-items works with every value except flex-start. On the image, this right boxes should touch to the image, not having space between. Making the right divs width:100% could solve the problem, but then they get really 100% of the container which makes them stand out of the container :/
The code:
.flex-container {
display: flex;
flex-direction: column;
height: 300px;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
outline: solid 1px green;
}
.flex-item {
background: blue;
color: white;
outline: red solid 1px;
}
.flex-item:first-of-type {
height: 100%;
width: 200px;
}<div class="flex-container">
<div class="flex-item"></div>
<div class="flex-item">first block</div>
<div class="flex-item">description</div>
<div class="flex-item">123,00€</div>
</div>
