Support for flexbox gutters in @webkit has just landed
More about that and other flexbox improvements done by @svillarsenin from @igalia on his last blog post:
https://trac.webkit.org/changeset/267829
https://blogs.igalia.com/svillar/2020/10/01/closing-the-gap-in-flexbox/
I'm excited to share details of a new conference coming March 2021 celebrating the modern web! It's been an honor to be the curator of the CSS track, and I encourage you to check out all the speakers confirmed so far 🎉
10 tracks
5 days
100% virtual on a new platform: EventLoop
Modern Web Summit: We've narrowed the #MWS2021 content to 10 tracks: Accessibility, CSS, GraphQL, Indie Hackers, Jamstack, Open Source, React, Serverless, Svelte, & Vue. Before we get into each of these subjects, let's talk about why we are featuring these tracks.
Lets unroll this 🧵 👇
less is more with CSS every time
Hampton: If you are trying to style something in CSS and you keep adding properties until it looks right. DELETE ALL OF THEM and go back and do it again and make sure you understand what was going on. Most of the time, you only needed 1-2 properties, vs all of the ones you tried.
Achieving Vertical Alignment (Thanks, Subgrid!)
https://css-tricks.com/achieving-vertical-alignment-thanks-subgrid/
Some New Icon Sets
https://css-tricks.com/some-new-icon-sets/
Make Your Own Dev Tool
https://css-tricks.com/make-your-own-dev-tool/
The Flavors of Object-Oriented Programming (in JavaScript) by @zellwk.
https://css-tricks.com/the-flavors-of-object-oriented-programming-in-javascript/
ooooops I guess we’re* full-stack developers now
https://css-tricks.com/ooooops-i-guess-were-full-stack-developers-now/
Linearly Scale font-size with CSS clamp() Based on the Viewport by @pprg1996
https://css-tricks.com/linearly-scale-font-size-with-css-clamp-based-on-the-viewport/
text-decoration-thickness: from-font;
text-underline-offset: .5ex;
.. headed for Chromium 87 🎉
will catch Chromium up with Safari & Firefox! Woot!!
🆕 from-font
look to the font for the font designer’s defined thickness or position, NOT the browser’s default
Intent To Ship: Blink: Intent to Ship: text-decoration-thickness, text-underline-offset and from-font keyword for text-underline-position
https://groups.google.com/a/chromium.org/d/msg/blink-dev/9OzS90KISXI/q5KYyyWBCAAJ
Web Technologies and Syntax
https://css-tricks.com/web-technologies-and-syntax/
A Gentle Introduction to Using a Docker Container as a Dev Environment by @burkeholland
https://css-tricks.com/a-gentle-introduction-to-using-a-docker-container-as-a-dev-environment/
The Empty Box
https://css-tricks.com/the-empty-box/
Layout and styling is the #1 developer pain point behind IE.
What frustrates you most about it?
Philip Jägenstedt: It’s finally out, the MDN Browser Compatibility Report:
A large part of 2020 for me has been diving into browser compatibility together with @robertnyman and @atopal, and this is certainly the longest report I’ve written.
Ask me/us anything!
https://mdn-web-dna.s3-us-west-2.amazonaws.com/MDN-Browser-Compatibility-Report-2020.pdf
Using Markdown and Localization in the WordPress Block Editor
https://css-tricks.com/using-markdown-and-localization-in-the-wordpress-block-editor/
Here it is: cube candy twist
Live on @CodePen
Detailed explanation on how to CSS a cube with modern techniques in this @css article
Ana Tudor 🐯: I’ve just recorded a video. A bit different from all the videos I’ve recorded since I came back this summer in that it animates a pretty big number of elements in 3D.
The result looks really laggy on my system in the video. May not be on your device? Should I publish it anyway?
I’ve just realized that you can become an MVP @css Supporter.
You get no ads, extra content, easier commenting, and you directly support amazing people and a remarkably useful resource.
At $20/year, that’s a steal:
https://bit.ly/2EbGTBa
Jamstack Conf
https://css-tricks.com/jamstack-conf/
#CSS media queries conditionally apply styles, BUT did you know they can conditionally load styles too?
This tasty sip pairs well with a main course of CSS bundle splitting 👍