Live data from Hacker News

Modern CSS Code Snippets: Stop writing CSS like it's 2015

modern-css.com

81–90 of 318 posts

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#81
post #71

My top list of recent CSS improvements: 1) Nested selectors. 2) :has(...). 3) :is(...), before you had to write :not(:not(...)). 4) :where(...), similar to :is(...), but the selector weight inside :where becomes 0. Useful when you need deep/complex selectors without increasing the selector weight.

I like 2-4 but I despise nested selectors. They make selectors ungreppable.

Why/how do you grep selectors? Seems overly optimistic to be able to guess the particular rule pattern that is applying a style. Browser tools are much more reliable.

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#82
post #68
post #59

Earlier quoted context omitted.

> most of those creative examples are in the 40-50% browsers support range. Not if you filter the examples. Click "widely available".

First widely available one I saw was this: https://modern-css.com/staggered-animations-without-nth-chil... That would actually fix some ugly CSS I have. The demo works. Neat. Except... the demo doesn't use either the old syntax or the new syntax. The browser support is wrong (Firefox doesn't support it, the site says Firefox 16+; it says Chrome 43+ but in reality it's much newer: Chrome 148+). It says "Since 2018" bu…

Yeah a lot of these demos say the features are widely available, but they don't actually work in my browser (Firefox on Macos).

Makes me wonder if these demos (or the browser support tables) were made by LLMs. They clearly haven't tested the demos in firefox.

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#83
Congratulations to the creator of this site and thank you so much for posting it !

I have to (unwillingly) do frontend work so I recently read up on CSS quite a bit. I have always thought that using computed numbers for styling is bonkers. Its better to use CSS that uses logical values. The site seems to emphasize that style.

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#85
post #13
post #9

Earlier quoted context omitted.

Yeah let's do that. You have everything related to your component on place instead of jumping between files.

Is jumping between files supposed to be difficult or something?

You can literally command click a class to go into a styled components css file. I do not understand what the big issue is.

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#86
post #43

Earlier quoted context omitted.

The deadest horse in web development is the myth of “separation of concerns”

It's a choice. The dominant paradigms choose not to. I disagree. And that makes me the loser here

Another loser here to second you

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#88
post #4

CSS in 2025: Let's write html inlined styles as if it was 2005 and separation of formatting/representation was never invented. I talk of tailwind, of course.

Tailwind is a direct response to how the "C" in "CSS" actually sucks, so there's no surprise that it's so popular.

I mean, the cascade really doesn't suck though does it. You really want to set font families and sizes on every p tag?

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#89

Random pet peeve... it annoys me when people have old browser-specific aliases to standardized CSS properties. For example, -o-tab-size and -moz-tab-size instead of just tab-size. Those properties haven't done anything on Opera/Firefox for a decade!

[dead]

Re: Modern CSS Code Snippets: Stop writing CSS like it's 2015

#90
post #26

Earlier quoted context omitted.

> React/JSX now confuses presentation and business logic React was originally designed to be the "V in MVC". You can still use it that way. React becomes very simple when you only use it as the V in MVC.

What are the M and the C, and how do they talk to the V in this case?

[deleted]
Post reply on HN