Flex box with collapsed height

By default, flex box makes item elements inherit the height of their container. To disable this behavior, and collapse item heights, use align: start (or the proper variation there-of).

.row {
  /* flex box */
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;   
  /* align start, disable vertical height */
  -webkit-box-align: start;
     -moz-box-align: start; /* FF <=20 */
     -ms-flex-align: start; /* IE10 */
  -webkit-align-items: flex-start;
          align-items: flex-start;
}
 Check out this Pen!