Flex items with specific proportions

We can also specify specific proportions for each of the items in our flex layout. The following code shows how you could split the available space 25-50-25 between three flex items:

.flex-50 {
  flex-basis: 50%;
}

.flex-25 {
  flex-basis: 25%;
}
...

<div class="flex-container-row">
  <amp-img class="flex-25" src="img/placeholder.png" layout="flex-item">
  </amp-img>
  <amp-img class="flex-50" src="img/placeholder.png" layout="flex-item">
  </amp-img>
  <amp-img class="flex-25" src="img/placeholder.png" layout="flex-item">
  </amp-img>
</div>