While doing my routine check of the latest user experience and design blogs I ran across this gem from Smashing Magazine. It breaks down the inner workings of the new flexbox model provided by the latest CSS3 specifications. This is definitely a must read if you care at all about the flexible box model
Some of the key features worth keeping an eye on include
- Automatically adjusting relative widths of children elements
- Controlling the presentation of elements purely with CSS
- Borders that span entire columns without ugly hacks
Like most of you I have done my fair share of battles with CSS floats, trying to get proportional formatting right, and doing complex mathematical gymnastics to get to a final goal. While this is still under development and I am certain subject to many iterations before it is properly supported at least it is a move in the right direction. I know that I for one will be playing around with it this weekend so I can add it to my toolkit.
When all you have a hammer everything looks like a nail. What happens when you have an entire bag at your disposal? Let's take a look at a case where a multitude of options exists for a simple task. That task is to animate a page element to bring an interactive experience to an otherwise static layout.