A simple example that demonstrates use of CSS Flexbox Layouts.

Consists of a simple page that could be any company's home page, with basic structure and minimal stylings.

The page has a

1. header - that contains a logo and site navigation links3 column layout

2. footer - that could contain any copyright message or any seo links

3. content - laid out in 3 column format with

   1. left column containing other actionable links,
   2. right column to contain any reference external links
   3. center column to hold any writeup

This is the layout when page is viewed in bigger screen resolutions (> 650px).

On smaller screens (< 650px), the layout changes to single column with all the sections stacked over one another.

The responsiveness is achieved using the new awesome Flexible Box Display model.

For more information on css flexible box display model, refer these excellent articles

1. A Complete Guide to Flexbox
2. Using CSS flexible boxes