#352 — August 8, 2018 Read on the Web Frontend Focus What Happens When You Create a Flexbox Flex Container? — Rachel Andrew unpacks how flexbox works in detail, starting with a look at what actually happens when you add display: flex to your stylesheet. Smashing Magazine Well-Controlled Scrolling with CSS Scroll Snap — An… Read More

#351 — August 1, 2018 Read on the Web Frontend Focus Priority Nav Scroller: Priority+ Navigation in a Horizontal Scrollable Container — A practical navigational element if you have a large number of category links to show. Comes as an ES6 module but a compiled version is also included. Nigel O Toole Implementing a ‘Double… Read More

#350 — July 25, 2018 Read on the Web Frontend Focus A Milestone for Chrome Security: Marking HTTP As “Not Secure” — Chrome 68, released this week (more on that below), shows a “Not secure” message in the location bar when accessing a site over unencrypted HTTP. The march to ‘HTTPS everywhere’ continues. Google Adding… Read More

#349 — July 18, 2018 Read on the Web Frontend Focus ?  The 9 Biggest Mistakes when using CSS Grid — A fast-paced 14 minute video (ideal for a lunch break!) that runs through things like overusing CSS Grid, reaching for frameworks too quickly, or worrying about IE11 too much. Jen Simmons Chrome’s ‘Site Isolation’ for… Read More

#348 — July 11, 2018 Read on the Web Frontend Focus A ‘div’ That Looks Different In Each Major Browser — A neat demonstration of how specs don’t guarantee an identical result across browsers. Here’s the CodePen to try it for yourself. Martijn Cuppens on Twitter Writing IE-Friendly CSS Grid Code — Want to lean… Read More

#347 — July 4, 2018 Read on the Web Frontend Focus Layoutit: A CSS Grid Layout Interface Builder — A very quick online way to put together a CSS grid layout and get the code needed to make it happen. We saw this getting some love on Twitter and were impressed with it ourselves. Leniolabs… Read More

#346 — June 27, 2018 Read on the Web Frontend Focus Drawing Images with CSS Gradients — If you’ve seen an illustration created purely with HTML and CSS but struggled to understand how it all comes together, this is a neat step-by-step guide to creating some of your own. Jon Kantner Assessing Loading Performance in… Read More

#345 — June 20, 2018 Read on the Web Frontend Focus CSS Doodle: A Web Component for Drawing Patterns with CSS — A Custom Elements-based component that builds an internal grid of DIV elements and then populates them using CSS to create patterns. Yuan Chuan ?  The Cost of JavaScript — In just 20 minutes Addy… Read More

#344 — June 13, 2018 Read on the Web Frontend Focus The New (and Old) CSS Units You’ve Never Heard About — Exploring the newly defined CSS units that have been recently or are going to be implemented in browsers, including lh, vi and grad. Massimo Artizzu Manipulating Pixels Using Canvas — If you’ve not… Read More