Issue 150
Flexbox alignment, card components, grid layout, position: sticky
News
Issue 150
I only just realised this is issue 150, meaning that I have sent this email for 150 weeks now without missing a week. More amazingly, there have been enough CSS Layout related links to fill 150 issues. Good going CSS community!
I am back from Hong Kong and off to MC CSSDay in Amsterdam. I have never been an MC before, however it is essentially an event where all of my friends are talking about CSS, so I think it should be a good day.
Thanks once again to Smashing Conference for the sponsorship of the email this week. I'll be at the Toronto event at this end of this month, as conference season steamrollers on!
Rachel Andrew, CSS Layout News
Intent to ship: shape-outside - Google Groups
The shape-outside property of CSS Shapes has been in Firefox Nightly for some time, and should be shipping in regular Firefox 62 on August 21st.
Learn
A Comprehensive Guide to Flexbox Alignment
A refresher on the Box Alignment properties as they work in Flexbox by Anna Monus.
Easier scrollytelling with position sticky
An excellent article on position: sticky.
Unlocking the Power of CSS Grid Layout
Last week I spoke at Webconf.asia with my talk Unlocking the Power of CSS Grid Layout. Slides and resources can be found here.
A Card Component
On Inclusive Components, a detailed explanation of how to create an accessible card component.
Interesting
CodePenChallenge: Cards Roundup - CodePen Blog
On the subject of card layouts, here are some fun examples from the recent CodePen challenge.
Our Sponsor
Smashing Conference Toronto - June 26-27 #noslides
What would be the best way to learn and improve your skills? By watching designers and developers over their shoulder! At SmashingConf Toronto (June 26–27), we'll do precisely that. All talks will be interactive design and coding sessions with speakers such as Dan Mall, Lea Verou, and Sara Soueidan where they show how to design and build things — including pattern libraries' setup, design workflows, debugging, naming conventions, and everything in between. Check all speakers →
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.