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
Flexbox Froggy - A game for learning CSS flexbox
A fun way to brush up on your Flexbox properties. The Flexbox Froggy game from Thomas H. Park.
Flexbox Grid Finesse — Medium
Nice article demonstrating how to control Flexbox grids, including how to control gutter spacing.
Use Cases For CSS Calc
Some use cases for CSS Calc, a useful CSS function with great browser support.
7 CSS Units You Might Not Know About
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.
Animating Your Brand ◆ 24 ways
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.
Scaled/Proportional Content with CSS and JavaScript | CSS-Tricks
Adding a little JavaScript to get scaled proportional content.
10 Guidelines for Better Website Background Videos
Some guidelines for those website background videos that have become popular.
Interesting
Frameworks · An A List Apart Article
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
Stop allowing your CMS to dictate your design or markup!
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.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.