Issue 25
The need for subgrid, product pages with flexbox and the state of Vendor Prefixes.
News
Issue 25
Lots of interesting reading this week, it seems as if everyone has woken up after the holidays! I'm working hard on getting my online CSS Workshop ready for launch, as well as working on the in-person material I'll be presenting as a two day workshop at Fluent in San Francisco.
I hope you find something interesting in the links this week - don't forget to let me know if you have something I can share with readers.
If you enjoy this newsletter and have a product or service that might be of interest to the almost 2,900 people who read this email take a look at the sponsorship page here. Your support would be appreciated!
Rachel Andrew, CSS Layout News
Learn
Designing A Product Page Layout with Flexbox
A practical walkthrough of designing a product page using Flexbox.
Create the perfect website layout system
A rundown of techniques to create responsive layouts without the use of media queries.
9 basic principles of responsive web design
An old article but still relevant, with simple demonstrations of some of the basic principles of responsive design. I like the little animations.
Leaner Responsive Images With Client Hints – Smashing Magazine
Not CSS, but images are an important part of our layouts that I think the article is a worthwhile inclusion. Client Hints are an initiative by Google, and now available in Chrome and Opera. This article demonstrates how Client Hints can simplify responsive images markup.
It's Time to Rethink Vendor Prefixes in CSS
A useful rundown of the current state of Vendor Prefixes on SitePoint.
Watch: The Axis of Flexbox
A short video by Guy Routledge explaining how the Flexbox Axes work.
Using Bootstrap 4 Flexbox - Designmodo
A good walkthrough of how Bootstrap 4 uses Flexbox. The flexbox part of Bootstrap is an option you need to enable, so this tutorial explains how to switch it on and how to use it in your site.
Interesting
Subgrids Considered Essential
Eric Meyer writes on a topic I care greatly about, this issue of subgrids in the Grid Layout specification. He has some excellent examples that show the problem of losing subgrid, I would love for more people to think about and post about this issue. If subgrid isn't implemented then it is likely to be dropped from Level 1 of the specification, creating a whole set of layout hacks before we even start.
Influencing Web Layouts with Print Layouts
Chris Coyier looks at how web design can be influenced by print design, and some of the emerging tools in CSS to help with that approach.
Our Sponsor
HTML and CSS to CMS in minutes
Perch is perfect for retrofitting a CMS to your website. Use our simple template language to give your client the ability to edit just the things they need to. No need to turn your whole site into a theme or change the way you develop when you use Perch.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.