# Good CSS learning resources and blog posts?

**URL:** <https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835>\
**Category:** Frontend Chat/Discussions\
**Tags:** css\
**Created:** [19 January 2024 09:11 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835 "2024-01-19T09:11:05Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Reinis](https://forum.devtalk.com/user_avatar/forum.devtalk.com/reinis/32/4575_2.png) [@Reinis](https://forum.devtalk.com/u/Reinis)\
**Post date:** [19 January 2024 09:11 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835/1 "2024-01-19T09:11:05Z")

</div>

For the last few months I’ve been (re)-learning vanilla CSS. Initially I did not ‘get’ how to structure CSS to take advantage of the ‘cascade’ and avoid specificity issues. Thus gravitated toward TailwindCSS. But now that I’m starting to grok vanilla CSS better, and especially modern features like layers, custom HTML elements and Declarative Shadow DOM, it is a game changer!

---

<div class="post-metadata">

**Author:** ![Josh](https://forum.devtalk.com/user_avatar/forum.devtalk.com/josh/32/647_2.png) [@Josh](https://forum.devtalk.com/u/Josh)\
**Post date:** [22 January 2024 21:02 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835/2 "2024-01-22T21:02:28Z")

</div>

I’m working on upgrading my CSS knowledge too. Are there any good resources that you’ve found?

I just learned Tailwind, and have been inspecting the generated CSS (hover in vscode) to see what CSS it generates.

---

<div class="post-metadata">

**Author:** ![AstonJ](https://forum.devtalk.com/user_avatar/forum.devtalk.com/astonj/32/7_2.png) [@AstonJ](https://forum.devtalk.com/u/AstonJ)\
**Post date:** [24 January 2024 04:39 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835/3 "2024-01-24T04:39:29Z")

</div>

I’ve had these bookmarked for a while. - just not had time to go through them yet:

> [@An Interactive Guide to CSS Grid](https://forum.devtalk.com/t/an-interactive-guide-to-css-grid/133380):
>
> An Interactive Guide to CSS Grid. CSS Grid is an incredibly powerful tool for building layouts on the web, but like all powerful tools, there’s a significant learning curve. In this tutorial, we’ll build a mental model for how CSS Grid works and how we can use it effectively. I’ll share the biggest bulb lightbulb moments I’ve had in my own learning journey. Read in full here: This thread was posted by one of our members via one of our news source trackers.

> [@100 Days Of More Or Less Modern CSS](https://forum.devtalk.com/t/100-days-of-more-or-less-modern-css/94366):
>
> 100 Days Of More Or Less Modern CSS. A blog post about modern CSS every day for 100 days. Read in full here: This thread was posted by one of our members via one of our news source trackers.

If you do please let us know what you think!

There’s also the tailwind book: #book-modern-css-with-tailwind-second-edition :023:

_(PS I moved these posts into a separate thread as I imagine lots of people will be interested!)_

---

<div class="post-metadata">

**Author:** ![Eiji](https://forum.devtalk.com/user_avatar/forum.devtalk.com/eiji/32/6784_2.png) [@Eiji](https://forum.devtalk.com/u/Eiji)\
**Post date:** [24 January 2024 05:46 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835/4 "2024-01-24T05:46:15Z")

</div>

## Tons of tutorials with examples on codepen

> **[CSS-Tricks - A Website About Making Websites](https://css-tricks.com)**

## Just to check browser support

[https://caniuse.com](https://caniuse.com)

## Svelte looks amazing for scoped styles

> **[Svelte • Web development for the rest of us](https://svelte.dev)**
>
> Web development for the rest of us

---

<div class="post-metadata">

**Author:** ![Hallski](https://forum.devtalk.com/user_avatar/forum.devtalk.com/hallski/32/610_2.png) [@Hallski](https://forum.devtalk.com/u/Hallski)\
**Post date:** [30 January 2024 20:45 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835/5 "2024-01-30T20:45:57Z")

</div>

Plus one on CSS tricks, can also recommend Kevin Powell on YouTube:  
[https://m.youtube.com/@KevinPowell](https://m.youtube.com/@KevinPowell)

---

<div class="post-metadata">

**Author:** ![brennan](https://forum.devtalk.com/user_avatar/forum.devtalk.com/brennan/32/6725_2.png) [@brennan](https://forum.devtalk.com/u/brennan)\
**Post date:** [31 January 2024 00:44 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835/6 "2024-01-31T00:44:16Z")

</div>

This is not free, but I heard this is good. [https://css-for-js.dev/](https://css-for-js.dev/)

---

<div class="post-metadata">

**Author:** ![Reinis](https://forum.devtalk.com/user_avatar/forum.devtalk.com/reinis/32/4575_2.png) [@Reinis](https://forum.devtalk.com/u/Reinis)\
**Post date:** [9 February 2024 09:49 UTC](https://forum.devtalk.com/t/good-css-learning-resources-and-blog-posts/140835/7 "2024-02-09T09:49:38Z")

</div>

Here’s a very reasonably priced [course on modern CSS](https://www.spicyweb.dev/css-nouveau/) that helped me make sense of the newest development in CSS.

And here are to two comprehensive articles on Web Components:

- [HTML Web Components Are Having a Moment](https://cloudfour.com/thinks/html-web-components-are-having-a-moment/)
- [The Good, The Bad, The Web Components](https://www.zachleat.com/web/good-bad-web-components/)
