Прибивание сайдбаров к верху и низу через flexbox
http://toster.ru/q/139927
by vovkasolovev
HTML
<div class="parent">
<article class="blue">
МАЛО
</article>
<aside>
<div class="gray">GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY</div>
<div class="red">RED RED RED RED RED RED RED RED RED RED RED RED</div>
</aside>
</div>
<div class="parent">
<article class="blue">
МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО МНОГО
</article>
<aside>
<div class="gray">GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY GRAY</div>
<div class="red">RED RED RED RED RED RED RED RED RED RED RED RED</div>
</aside>
</div>
CSS
.parent{background: lightgray; display: flex;}
article{width: 70%; display: flex;}
.blue{background: blue; align-self: flex-start}
aside{width: 30%; display: flex; flex-direction: column; justify-content: space-between; border:3px dotted white;}
.gray{background: gray;}
.red{background: red; align-self: flex-end}