If we give a `container-name` to the root of all our unique components, we can scope styles to them with a simple @container query.
We’ll make some extremely stylized range sliders with simple semantic HTML and some very fresh CSS. You might be surprised how custom these things can get these days.
CSS containment is used for optimization and opening styling possibilities by isolating elements from the rest of the page. Different contain values (size, paint, layout, etc.) provide various benefits and tradeoffs.
On iOS, there is a setting for Text Size. I’ll do a video here for the current version of iOS (17.5.1) to be clear: As far as I ever knew, that controlled the text size on the OS itself and native apps. It didn’t effect websites. I think that’s largely true, but I just learned […]
Svelte is already quite lightweight and fast, but Svelte 5 still overs big improvements in fine-grained reactivity, meaning re-rendering as absolutely little as possible.
Support for the relative color syntax in CSS is across the board now (go interop!), so here we look at some basic (and still very useful) use cases, like applying alpha to a color you have on hand.
Native support for decorators is inevitable! It simplifies augmenting class methods, which can help with things like logging, memoization, debouncing, and dependency injection.
Calibre, the website performance testing app, launched a one-off Website Speed Test page anyone can use for free. This is nice it requires no special knowledge to use (anyone can type in a URL), the test can be run from significant geolocations (that probably aren’t where you live), and the test result is saved and can be shared.
webpagetest.org is the classic in this space. Both are trying to sell you more advanced services. Just a matter of which you find more useful.
A “game” where you enter the right CSS to move to the next level, teaching you CSS anchor positioning along the way.
In the vein of Flexbox Froggy, which I know clicked with a ton of people. Made by Thomas Park, who’s company Codepip actually makes a ton of these experiences.
What is a good contrast text color on a black background? White. What about on a white background? Black. What about on #f06d06? Less clear. Devon Govett posted a good trick to having CSS pick for you, which works across browsers today. Lea Verou has a much deeper dive. There is supposed to be a CSS color-contrast() function, but it’s not usable across browsers yet.
In 2024, A Book Apart closed its doors after publishing a much-loved collection of more than 50 brief books for people who make websites. The rights to each book have reverted to the authors — hi, that’s us — and we’ve put together this semi-official directory to help you find our books in their new homes.
My own book on SVG is in there, which I chucked on my own website and wrote about here.
Developer news, information, and advice — right to your feed reader of choice.
RSSHere's our page on guest writing. It's a win-win-win!
Frontend Masters donates to open source projects through thanks.dev and Open Collective, as well as donates to non-profits like The Last Mile, Annie Canons, and Vets Who Code.
