Skip to content

Issue 249

Masonry layout, lists, CSS, functions, and a Hero Generator.

Rachel Andrew
2 min read


Issue 249

It appears that it is Tuesday again, and therefore another issue of CSS Layout News. Going to give a quick mention that we've just announced our SmashingConf Live event at Smashing Magazine, along with a whole array of new workshops, including a new presentation of my CSS Layout Masterclass, which sold out last time.

I don't know when in-person events will restart, but for the time being it's great to be able to carry on sharing these things and talking to people online. And, at an in-person workshop you don't get chance to see my cat causing mayhem behind me as I try to answer questions on CSS!

Rachel Andrew, CSS Layout News

Does masonry belong in the CSS Grid specification?

My thoughts on the masonry proposal from Mozilla, plus a demo of the proposal.


CSS Layout — Smashing Magazine

Over at Smashing Magazine I've been working on a project to create curated guides through some of our content. Given I've written so much layout material, the Guide to CSS Layout was the content we were using to test the design. Also live is a guide to performance, and one for JavaScript and Frameworks. More soon!

List Style Recipes | CSS-Tricks

A focus on styling lists over at CSS Tricks.

A Complete Guide to CSS Functions | CSS-Tricks

Here is a very useful guide to functions in CSS.

CSS Clamp: The Goldilocks of CSS Math Functions - Steve Fenton

An explanation of the CSS clamp() function.

CSS Only Tooltip for All Screen Sizes

A little guide to help you make a CSS tooltip.



Need a make a hero banner on your website? Save some time and use Sarah Drasner's Hero Generator.

Our Sponsor

Earlybird pricing for my all-new CSS Layout video course

Earlybird pricing for my all-new CSS Layout video course

I've been completely rewriting and re-recording my CSS Layout course. You can learn Grid, Flexbox, browser support and much more by coding along with me in these lessons.

The first lessons are now online and if you sign up for the complete course with code EARLYBIRD, you will get a $40 discount and be first to see all of the new material as soon as it goes online.