flexbox

This article is a stub. You can help the IndieWeb wiki by expanding it.

Flexbox (or CSS Flexible Box Layout) is a CSS layout model for aligning and distributing space among items in a container.

Flexbox makes it easier to create complex and responsive layouts with fairly simple CSS rules paired with a simple HTML structure. It has decent browser support at this point, so why not treat yourself to responsive "holy grail" layouts and sticky footers without the hastle of doing it the old way.

"The Flexbox Layout (Flexible Box) module (currently a W3C Last Call Working Draft) aims at providing a more efficient way to lay out, align and distribute space among items in a container, even when their size is unknown and/or dynamic (thus the word "flex")."

A complete guide to flexbox

Helpful resources on learning and using flexbox

• A complete guide to flexbox
• Solved by flexbox
• Cheatsheet
• flexplorer
• flexbox in 5
• Intro to flexbox
• Intro to flex containers
• Intro to flex containers 2
• Intro to grow shrink
• Flexbox intro with code examples
• Grow shrink with code
• Standard layouts with code
• Intro to layouts
• Real world flexbox
• Can I use flexbox?
• Prefix free flexbox

See Also

• CSS Flexible Box Layout
• grid
• to-do: needs IndieWeb-relevance in dfn (IndieWeb is not Wikipedia), and in content