Greg “Stache” Westneat
Connect with me
Font-End Developer for Foster Web Marketing: Creators of DSS

I think many web-developers would agree that the most exciting session from this year’s Google I/O conference, was “The Web Can Do That!?”, given by senior Chrome Team developer, Eric Bidleman.  

Bidleman covers many forthcoming developments in modern browser capability that sent butterflies in my belly, but the one thing that meant the most to me was a little CSS candidate called Flex-Box

The Problem

I can remember long ago, when I was still just starting to get down on web design, there was the persistent agony of positioning things; and in particular centering things and spacing like-elements evenly.  It leads to some very messy cases, the most frequent of which went something like:

.element{
position:absolute;
left:50%;
width:80px;
margin-left: -40px; /*half the width of the element*/
}

‘Awkwardly large amount of code, but it worked...unless you wanted to keep the width dynamic…

It gets very complicated, and frustrating, and probably led to the disappearance of countless packages of double stuffed Oreos, in many “eat your feelings” related episodes.

The Solution

It’s the vestiges of these early torments that makes me so pumped about flex-boxes, because positioning is super easy. Ill let Bidleman take it from here. Enjoy!!!

Drawbacks?

Right now, browser support is weak and essentially all contingent on browser prefixes. Sadly, flex-box will still require browser prefixes for the foreseeable future. Step in the right direction though!

Fun Fact:

Did you know 9 out of 10 Paul Irishes Agree that Flex-Boxes are trill and will drastically reduce the level of misery associated of positioning elements?!

Related Links:

CSS3 Flexible Box Layout Explained

Join The Conversation
Shannon 09/26/2012 05:59 PM
And for those of you unaware, "trill" is a new slang word combining "true" and "real". Which while true in statement about flex-boxes being our future, it doesn't entirely make sense. For a complete definition: Trill.
Post A Reply
web application development 10/12/2012 04:21 AM
Your article has proven useful to me. It’s very informative and you are obviously very knowledgeable in this area. You have opened my eyes to varying views on this topic with interesting and solid content. web application development
Post A Reply
Post A Comment