Issue 18
Flexbox, Calc, length units - lots to learn this week.
News
Issue 18
This week I have a whole bunch of tutorials and learning for the newsletter. Find out about CSS Calc, length units, animation, Flexbox and more. If you tend to have a quieter time over the holiday period it can be a good time to brush up on skills and learn some new things.
Rachel Andrew, CSS Layout News
Learn
A fun way to brush up on your Flexbox properties. The Flexbox Froggy game from Thomas H. Park.
Nice article demonstrating how to control Flexbox grids, including how to control gutter spacing.
Some use cases for CSS Calc, a useful CSS function with great browser support.
Some of the newer CSS length units can make creating responsive layouts much easier. Here is a guide to these lesser-known units include vh, vw, vmin and vmax.
24 Ways kicks off for 2015 with an article on Animating Your Brand. I like the approach of incuding animation in the style guide and making sure that animation isn't something we "tack on at the end" of the design process.
Adding a little JavaScript to get scaled proportional content.
Some guidelines for those website background videos that have become popular.
Interesting
An excerpt from Ethan Marcotte's new book, Responsive Design: Patterns and Principles. Thinking about how we need new principles for responsive design. It's a welcome change of pace from just thinking about how we technically implement layout.
Our Sponsor
The job of your content management system is to manage content. So why do so many systems also feel the need to dictate the layout of your site or even insert their own HTML? Perch and Perch Runway give that control back to you. We never insert anything into your site that you can't change easily using our simple template syntax.