Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

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

modern-css.com

Post reply on HN
Print view View original

111–120 of 318 posts

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

#111

Post by seer »

apsurd wrote: post #37
azangru wrote: post #32

Earlier quoted context omitted.

If you move the data (the M and the C) entirely out of react, and only pass it in via props, there would be only one place — the root react node — where the props could get into react. Is this what you have in mind? Or are you envisioning multiple root nodes?

Well, i've always been a fan of the island architecture that effectively mounts root nodes as little islands of isolated state, yes. Mainly this avoids the hell that global state SPA patterns produce: redux, reducer patterns in general, and 8 thousand context providers. I do think there's use cases that warrant global in-memory state, but it's such a pain in the ass to maintain and evolve, i'd always plan against it.…

Do you need react at this point? Isn’t it just html/css/components?

I remember the birth of React was because Facebook had a problem - you would add a comment and your notification bar would sometimes not get updated.

They had so many bugs with normal html / css that they wanted to solve this on the application layer - to make inconsistent UI elements unrepresentable.

So they came up with react with global state - because in their use case changing one thing does affect a bunch of other unrelated things, and they all need to sync together.

I mean honestly that’s what I use React _for_ - especially with contexts it’s very easy to express all of this complex interconnected state of a webapp in a consistent way.

And of course there are other ways to solve it - for example with elixir/phoenix you just push all that complexity to the backend and trust in websockets and the BEAM.

I just feel that if you really don’t need global state, then react kinda isn’t needed as well…

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

#112

Post by mhuffman »

zeroCalories wrote: post #100
IgorPartola wrote: post #61

Earlier quoted context omitted.

I was recently doing some very specific web scraping of some very public very static documents. About 25% of them use a soup of divs with hashes for class names. Not a or or in sight. I am fine with the idea of what tailwind does but like at least using semantic tags where appropriate could be a thing.

Tbh there's nothing really wrong with that. You don't need stuff like article or section if you set the right attributes. Often easier to just use divs to get the structure right, and figure out the meaning later.

Well, it does help if you expect sight impaired people with software to find the site useful.

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

#113

Post by ordersofmag »

zeroCalories wrote: post #100
IgorPartola wrote: post #61

Earlier quoted context omitted.

I was recently doing some very specific web scraping of some very public very static documents. About 25% of them use a soup of divs with hashes for class names. Not a or or in sight. I am fine with the idea of what tailwind does but like at least using semantic tags where appropriate could be a thing.

Tbh there's nothing really wrong with that. You don't need stuff like article or section if you set the right attributes. Often easier to just use divs to get the structure right, and figure out the meaning later.

And there's 'nothing wrong' with just writing code with variables named 'a1, a2, a3'. But when some poor sod has to dig through your mess to figure out what you had in mind it turns out that having an easier to discern logical structure to your code (or html) makes it better. I've dug through a lot of html. And there's a ton of ugly code smell out there. Layers and layers of "I don't really know what I'm doing but I guess it looks okay and I'll make it make sense later". I'm sure it pays the bills for someone. But it makes me sad.

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

#115

Post by raincole »

ktpsns wrote: 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.

Yeah and it's a really good idea. You can't really 'separate layout from style.' The layout and the style are both parts of the UI. HTML isn't the content, it's the layout.

Even if you believe separation of concerns is the eleventh commandment, HTML and CSS are the same kind of 'concern' anyway. They're both at representation layer. Pretending you can decouple them is just burying the head in the sand.

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

#116

Post by marcuswestin »

dk8996 wrote: post #114

Very cool. Could you include a skill.md of AGENTS.md for this?

“Please study the material on https://modern-css.com/ and write a skill.md and an AGENTS.md that succinctly utilizes all the content”

Or maybe even! “https://modern-css.com/ is very cool. Could you include a skill.md or Agents.md for this?”

Or! “Please do: https://news.ycombinator.com/item?id=47030502“ =]

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

#117

Post by raincole »

zeroCalories wrote: post #100
IgorPartola wrote: post #61

Earlier quoted context omitted.

I was recently doing some very specific web scraping of some very public very static documents. About 25% of them use a soup of divs with hashes for class names. Not a or or in sight. I am fine with the idea of what tailwind does but like at least using semantic tags where appropriate could be a thing.

Tbh there's nothing really wrong with that. You don't need stuff like article or section if you set the right attributes. Often easier to just use divs to get the structure right, and figure out the meaning later.

Exactly this.

I wonder if the people downvoted you realize that HN is basically just a big table and a bunch of div, and they use this very site just fine?

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

#118

Post by dotancohen »

raincole wrote: post #117
zeroCalories wrote: post #100

Earlier quoted context omitted.

Tbh there's nothing really wrong with that. You don't need stuff like article or section if you set the right attributes. Often easier to just use divs to get the structure right, and figure out the meaning later.

Exactly this. I wonder if the people downvoted you realize that HN is basically just a big table and a bunch of div, and they use this very site just fine?

As a user, I don't care.

As a disabled user with a screen reader, I might care.

As a developer tasked with maintaining it after the original dev left, I most certainly would care a great deal.

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

#119

Post by akst »

IgorPartola wrote: post #61
namuol wrote: post #43

Earlier quoted context omitted.

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

I was recently doing some very specific web scraping of some very public very static documents. About 25% of them use a soup of divs with hashes for class names. Not a or or in sight. I am fine with the idea of what tailwind does but like at least using semantic tags where appropriate could be a thing.

I do sympathise as someone who has to scrape content from time to time, but that doesn't sound like a problem for the author of the content or something that impacts their intended user.

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

#120

Post by nilslindemann »

senfiaj wrote: 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.

My favorite is @layer
Post reply on HN