Skip to content

Issue 18

Flexbox, Calc, length units - lots to learn this week.

Rachel Andrew
2 min read


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


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.


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!

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.