Dive into Flexbox

Flexbox is a new layout mode in CSS3 that is designed for the more sophisticated needs of the modern web. This article will describe the newly-stablized Flexbox syntax in technical detail.

Great to see that after three years it has become a candidate recommendation. Time to start digging a grave for faux columns (née 2004) and all vertical css centering articles.

Dive into Flexbox →

Freetile

Freetile is a plugin for jQuery that enables the organization of webpage content in an efficient, dynamic and responsive layout. It can be applied to a container element and it will attempt to arrange it’s children in a layout that makes optimal use of screen space, by “packing” them in a tight arrangement.

Like Masonry, but with a few twists. For example Freetile does not require a fixed width column grid.

Freetile Demo →
Freetile Source (GitHub) →

What’s the Deal With display: inline-block?

We’ve been using floats for layout pretty much since we left tables behind. It’s a quirky solution that can often cause troubles, but if you know what you’re doing, it works.

One interesting alternative to floats that people are turning to more and more lately is to set the display value of an element to inline-block. What does this do exactly? How is it like a float? How is it different? Let’s dive in and see what we can discover.

Interesting to see that we’re re-educating ourselves as browsers have become better and better over the years.

What’s the Deal With display: inline-block;? →