When a web page doesn't have enough content to fit the screen, the footer doesn't stay at the bottom so it ends up looking weird. Solution: Do the layout using flex columns. In addtion to that either, add flex-grow: 1 to the content area, here it is the section. Or add margin-top: auto to the element you you wish for it to always stay at the bottom, here it is footer.

Playing around with the new CSS Grid module spec and Flexbox.

Column-based flexbox timeline layout. The goal is to have clean, semantic HTML while creating a (somewhat complex) timeline-looking layout.

CSS Grid, Flexbox, blend-modes and Apple.

A copy of the Red Onion's Daily Prophet using Flexbox.

A responsive layout using flexbox with narrative text and speech bubbles styled in CSS. Background patterns also in CSS. The only acceptable use of Comic Sans font.

Based on the input on https://webflow.com/cms. Changed to make use of pseudo elements and flexbox layout.

A pocket-sized grid system built on the flex display property.

Yet another small CSS framework that helps developers and beginners to quickly create fully responsive, nested grid layouts using CSS flexbox model.

Align.css is a pure CSS library which can be used to align elements inside a container element using CSS Flexible Box Layout.

Flexy is minimal CSS framework made with Flex

Griddd is a lightweight, responsive, CSS flexbox based grid layout that is fully customizable via SASS.

Create Pinterest-like boards with pure CSS, in less than 1kB.

Pure CSS, flexible and gapless image gallery layout like Google Images and 500px.com

Fukol(tm) is a tiny (less than 1kb), extendable, fully responsive, Flexbox based, progressive enhancement CSS grid responsive for modern web design.

infinity-css-grid is an ultralight (less than 0.1kb ) CSS layout system that helps web developers quickly generate responsive, flexible grid layout using CSS flexbox.

An easy to use flexbox grid system.

Unopinionated utilities for resizeable split views

CSS layout components that (basically) horizontally and vertically stack anything.

Intrinsic first auto-layout flexbox grid

The csslayout project provides a collection of 70+ commonly used layouts, components, and patterns for the modern web & mobile design.

A lightweight masonry (cascading grid layout) library powered by flexbox.

flex.css is declarative layout which is compatible with wechat, UC, webview and other main-stream mobile browser and surpports react, vue, angular.

A lightweight Vanilla JS library to help you generate a responsive, mobile-friendly Masonry grid layout using CSS flexbox.

The lightweight alternative to a bootstrap grid system. Tired of importing entire frameworks for an effective grid system? Try using CSS Column Pro for a reliable lightweight CSS Grid System.

columns-resize is a JavaScript library to help create table-like, multi-column, and resizable web layouts using CSS Flexbox.

There are many ways today to solve for equal height elements on modern web development. The best two ways are to use CSS flexbox and Grid Layout.