October 2017
Intermediate to advanced
370 pages
8h 57m
English
Flex items can also be arranged vertically in columns. This time, we flip the width and height dimensions of the parent so that it is three times as high as it is wide:
.flex-container-col { display: flex; flex-direction: col; width: 150px; height: 450px;}...<div class="flex-container-col"> <!-- 1 flex item --> <amp-img src="img/placeholder.png" layout="flex-item"></amp-img></div><div class="flex-container-col"> <!-- 2 flex items --> <amp-img src="img/placeholder.png" layout="flex-item"></amp-img> <amp-img src="img/placeholder.png" layout="flex-item"></amp-img></div>...<div class="flex-container-col"> <!-- 7 flex items --> <amp-img src="img/placeholder.png" layout="flex-item"></amp-img> <amp-img src="img/placeholder.png" ...Read now
Unlock full access