Skip to content

Issue 266

folding websites, hidden content, gradients, and CSS Shapes

Rachel Andrew
1 min read


Issue 266

A bit of a shorter issue this week as yesterday was a holiday in the UK, and I very unusually had some time doing things away from the computer. This mostly involved digging holes in my garden, some of the holes even have plants in them now!

We are now into September, and in more usual times that tends to come with a lot more activity as people return from vacations, and the autumn/fall conference season. We will see how that plays out this year.

I have another CSS Layout Masterclass scheduled for next week, and there are a few tickets remaining if you would like to come learn CSS with me. These sessions are really good fun, and I can promise you will learn a lot! Take a look here for all the details.

Rachel Andrew, CSS Layout News


Short note on content-visibility: hidden – HTML Accessibility

A good explanation of content-visibility: hidden.

Gettin’ Foldy with the Dual-screen Web (Part I) -

Using an emulator to design for dual-screen devices.

Gradient angles in CSS, Figma & Sketch

Interesting comparison of gradients in CSS, Figma and Sketch.

Create a line break while maintaining inline status - Piccalilli

This is a useful little tip, and a reminder that generated content can be useful for all kinds of unexpected things.


CSS Shapes Layout Experiment

Via the CodePen newsletter is this demo, which uses CSS Shapes.

Our Sponsor

Boost Your Front-End Skills Online: Smashing Workshops

Boost Your Front-End Skills Online: Smashing Workshops

Boost your design skills online and learn practical insights from experts in the industry, live. That’s Smashing Online Workshops, broken into 2.5h live sessions, spanning across weeks. With tangible takeaways, exercises, access to experts, slides, recordings and a friendly Q&A. Join The CSS Layout Masterclass with Rachel Andrew, Vue.js: the Practical Guide with Natalia Tepluhina, and many more using the code CSSLAYOUT to save $50 off the price! Meow!