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

191–200 of 318 posts

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

#191

Post by UqWBcuFx6NV4r »

the_other wrote: post #177
namuol wrote: post #43

Earlier quoted context omitted.

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

SoC is how all maintainable software is built. A function for A, a class for B, DDD-spec'd modules and features, databases on separate machines, API definitions, queuing systems, event systems, load balancing, web servers. You don't even need to think of the web to see how content and presentation are different. Try editing a text file with hard line breaks in and you'll quickly understand how presentation and conten…

Please don’t be so condescending. We all know what separation of concerns is.

The comment said “web development”, and it’s inarguably that in the history of web development there have been at least a couple of major misapplications of separation of concerns, which have had practically everlasting negative consequences.

Read what you’re replying to before you reply to it.

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

#192

Post by UqWBcuFx6NV4r »

nilslindemann wrote: post #132
namuol wrote: post #126

Earlier quoted context omitted.

Obfuscate? I can learn tailwind and use it in dozens of projects. I can use tailwind in my project and onboard dozens of developers immediately. I can learn your CSS conventions and use them in exactly one project.

Why can you use CSS conventions in only one project?

Can we all just drop words out of comments that we reply to if it makes it easier to make our point?

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

#193

Post by UqWBcuFx6NV4r »

bobthepanda wrote: post #137
halfcat wrote: post #99

Earlier quoted context omitted.

Cognitive load of looking at 12 open files trying to understand what’s happening. Well, in fairness some of those 12 are the same file because we have one part for the default CSS and then one for the media query that’s 900 lines further down the file.

Css modules gets away from the larger sins of the massive global css files. If modules had existed much earlier it probably would’ve gotten rid of most of the awfulness.

Oh, great. So let’s just 2x all our files then! All for, what exactly?

It sounds like you just want to write Java.

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

#194

Post by dalmo3 »

sollniss wrote: post #141

I hate how it's still not possible to properly style the numbers in ordered lists. I use them for code snippets with automatic line numbers, but it's literally impossible to space the numbers (relative to the code) while keeping them aligned to the right. ¯\_(ツ)_/¯ https://jsfiddle.net/89t1rd2u/

Try ::before and css-counters.

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

#195

Post by UqWBcuFx6NV4r »

paradox460 wrote: post #108
what wrote: post #74

Earlier quoted context omitted.

That’s actually disgusting.

It gets worse Check out the Netlify admin dashboard screenshot in my blog post https://pdx.su/blog/2023-07-26-tailwind-and-the-death-of-cra...

[flagged]

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

#196

Post by jcgl »

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.

That's totally orthogonal to Tailwind though; there's nothing that precludes you from combining semantic elements with it. The only thing that would make a dev reach for instead of is the dev's own (lack of) taste. It's no different than writing out separate CSS or using inline styles.

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

#197

Post by selimco »

p0w3n3d wrote: post #143

Live demo for input:user-invalid does not work on my phone. It'd always been the same: those ugly patches of JavaScript were being added to maintain compatibility with all the browsers... That's why the newest CSS tricks were always out of reach for us

The drop cap example is also broken for me on the latest Firefox version. It still requires a manually set line-height of 1.

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

#198

Post by oneeyedpigeon »

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?

It's possible to know that HN is basically a big table, use the site just fine, and still recognise that there are disadvantages to that approach.

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

#199

Post by throwaway290 »

selimco wrote: post #197
p0w3n3d wrote: post #143

Live demo for input:user-invalid does not work on my phone. It'd always been the same: those ugly patches of JavaScript were being added to maintain compatibility with all the browsers... That's why the newest CSS tricks were always out of reach for us

The drop cap example is also broken for me on the latest Firefox version. It still requires a manually set line-height of 1.

Also broken on latest Safari & iOS. They should add screenshots how it supposed to look

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

#200

Post by tgv »

namuol wrote: post #43
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.

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

I don't think "separation of concerns" is entirely dead. Ideally, the CSS is readable and maintainable, and that implies structure. If you have a bunch of (co-)related components, you don't want to find/replace tailwind class names when you need to change the layout. So you separate that part of the layout in classes based on (layout!) functionality. You can see that as "concerns."
Post reply on HN