Flexbox Layout Assignment

Form Row Using Flexbox (Example #1)

Row With One Wider Column

Main Content

This is the main area. Because it uses a larger flex value, it becomes wider than the sidebars and takes up most of the row.

Row With Equal Width Columns

Feature One

All three boxes share the available width equally.

Feature Two

Flex 1 on each item creates equal-width columns.

Feature Three

Flexbox also keeps the column heights consistent.