Introduction to SVG Animation
Sarah Drasner explains why animating SVG is different from animating in CSS, and how to work around some common hiccups you might experience along the way.
Issue #236
Learn why animating SVG is different from animating in CSS, how to write maintainable CSS, how to create a bank of small, simple animations that can be applied in multiple situations, and more.
From Our Sponsor (via Syndicate)
Let top tech companies apply to you.
Top software engineers & UX/UI designers are using Indeed Prime to land their dream job. Interested companies reach out with salary & equity upfront. Free for job seekers. Get $2k from Indeed Prime when you’re hired.
Articles & Tutorials
Create a Set of Micro-Animations
Donovan Hutchinson discusses how to create a bank of small, simple animations that can be applied in multiple situations.
Pure CSS Content Filter
Harry Roberts explains how, by using CSS’ :target pseudo-selector, you can work out what a user has clicked on, and by using the adjacent sibling selector, you can use that user’s action to style subsequent parts of the DOM.
Designing Grids
Zell Liew shares what he learned about designing grid systems for a responsive website.
Creating the Periodic Table with Grid CSS
Justin Avery explores what would a periodic table look like if it was built from a purely semantic point of view in HTML, and how would that then translate to the screen from a design point of view.
Which Doctype Should You Use in Html Emails?
Rémi Parmentier explains everything you need to know about doctypes in HTML emails.
Tools
Inspiration
Angry Birds in Pure CSS
Rachel Bull recreated Angry Birds in pure CSS, using pseudo classes and box-shadows.
Until Next Week
If you like the content, please consider supporting CSS Weekly on Patreon. Thank you!
Happy coding,
Zoran Jambor
CSS Stickers
A set of beautiful, cute, and funny CSS stickers to showcase your love for CSS.
