Things You Can Do With CSS Today

Celý článek

Some nice coverage from Andy about CSS things that are truly new. If you haven’t looked at new things in CSS in, say, a year, I’d bet pretty much all of this will be new to you. A lot of it is cutting-edge enough that you might not be able to get it into projects immediately, but that gap is getting pretty short these days. Rough guess, I’d say a year and we’ll be using all this stuff without much thought.

• Masonry layout (e.g. grid-template-rows: masonry;) which I think was a terribly clever way to approach this long-awaited feature..
• The :is selector which makes certain selectors way less obnoxious to write (e.g. article :is(h1, h2, h3):not(:first-child)). This makes me wonder why we never had such a thing in Sass that helped with that.
• Functions like min(), max(), and clamp(), and I think the best practices and clever uses for them are just shaking out. Fluid type is the most obvious and useful example, but only scratches the surface.
• Units like ch and ex. I really like max-width: 70ch;. There’s a general bit of typography advice that line length should be between 45 and 75 characters long (I made a bookmarklet to test it once), so rather than forcing that with some abstractly related width, you use the actual width of characters as the width.
• Fancy text-decoration (e.g. text-decoration-thickness: 0.5rem;) meaning we can thicken up an underline without giving up the usefulness that is text-decoration-skip-ink like we would if we had to resort to a border.)

Direct Link to Article — Permalink

The post Things You Can Do With CSS Today appeared first on CSS-Tricks.

You can support CSS-Tricks by being an MVP Supporter.