Issue 168
Negative Grid Lines, modals, accessibility, and how a browser works.
News
Issue 168
This CSS Layout News introduction comes from a British Airways aircraft as I return from the USA to the UK. I'm now looking forward to being in Lyon for W3C TPAC, and the CSS Working Group meetings there, after a few days at home this week.
I've been chatting with a few teams about coming in and running CSS Layout workshops for them, and right now is a very good time to book me for early next year, before my diary starts to look silly! Drop me a line if your company would like me to come and spend a day teaching a practical approach to CSS layout, based on your requirements.
Rachel Andrew, CSS Layout News
Learn
CSS { In Real Life }
An article about positioning items using negative grid lines, plus the creation of implicit tracks.
MODALZ MODALZ MODALZ
A site with some suggestions as to how to avoid a modal, with example design patterns.
Accessibility Cheatsheet — Practical approaches to Universal Design
I like this accessibility cheatsheet. A few practical tips to help you make your design more accessible.
Valid CSS Content | CSS-Tricks
A post about generated content in CSS. As the article points out, as web developers we most often use generated content for adding styling elements, in the world of Paged Media however generated content is used for much more. I wrote an article a few years ago about using CSS for printed publications, which features the use of generated content to add content to the header and footer of pages.
Interesting
CSS Grid Posters - a Collection by Nick Sands on CodePen
A fun collection of posters created using CSS Grid Layout.
Inside look at modern web browser (part 3) | Web | Google Developers
Part three of a four part series looking at how web browsers work to turn your HTML, CSS and JavaScript into a web page and send it to the visitor. This part covers the renderer and is therefore of interest to those of us who are interested in layout, but I can recommend the whole series if you really want to know how things work.
Our Sponsor
Learn CSS Layout with my comprehensive video course
I've distilled my knowledge about CSS Layout into this training course. This course has something for you if you are new to CSS, have been using frameworks for a while and want to understand how they work, or have been doing this for a while but want to understand the newer layout methods. The course includes video tutorials, text explanations and all the starting points to follow along.
The full table of contents gives an overview of what you can learn - at your own pace. We also have a Slack community where you can ask questions about the course materials.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.