Issue #541

February 24, 2023

Easing Curves, and Better CSS Transitions and Animations

Josh Collinsworth shares a fantastic guide on CSS cubic-bezier easing curves and how to create the best possible transitions and animations in your web UI.

Katie Hempenius created a deep dive into font fallbacks and the size-adjust, ascent-override, descent-override, and line-gap-override APIs.

Try 30 free days of unlimited, online creative classes

With Skillshare, you can watch thousands of creative classes taught by expert instructors. Start your free 30-day free trial to get started today.

Start Your Free Trial

CSS Weekly on YouTube

In-Depth Guide to CSS Logical Properties

A practical guide to CSS Logical Properties where I outline:
🤔 Why you should switch to logical properties
🧠 How logical properties work
🧱 How to use “inline” and “block” dimensions
🎨 How to rework existing CSS to logical values

Learn More

Articles & Tutorials

Try out CSS Nesting Today

Jen Simmons gives a short introduction to native CSS nesting, already available in Chrome and Safari.

(255,255,255) is the Highest Specificity

Bramus Van Damme gives an interesting write-up on the technical limits of CSS Specificity, concluding that you should never hit that limit.

A Step-By-Step Guide To Building Accessible Carousels

Sonja Weckenmann addresses step-by-step design considerations as well as semantic requirements for carousels to be accessible.

Last Baseline Alignment

Rachel Andrew shares fantastic news that all major browser engines now support last baseline alignment in CSS Grid and Flexbox.

HTML Input Types

Marko Denic gives a detailed overview of the different types of HTML input elements.

Avoiding the Five Common Pitfalls of Data Privacy and Security

Innovating and delivering products quickly is essential to any company’s survival, but taking shortcuts on data security and privacy is very costly in the long run.

As you aim to balance speed and security, don’t lose sight of the most common data privacy pitfalls and how you can avoid them.

Download the free white paper today.

Tools

CSS-Doodle

A web component for drawing patterns with CSS. It generates a grid of divs that you can easily manipulate using CSS to create a graphic pattern or an animated graph.

Check it out