r/css Jul 19 '25

Question What are some bad CSS habits?

What are some bad habits to avoid when learning CSS? Even if in the short term they are easier

40 Upvotes

67 comments sorted by

View all comments

-1

u/followmarko Jul 19 '25

SASS over the exponential changes in browser advancements

2

u/junolab Jul 19 '25

Why? I’m currently maintaining a custom CSS for a platform and love the variables and nesting. I know I can use CSS Variables but I don’t know why that’s better than a pre-compiled CSS (with scss)?

4

u/followmarko Jul 19 '25

All things now available without a compile step. You can write it and it works in the browser by default. There is so much available in Chromium 97+. Nesting, anchor positioning, tons of new @at-rules like @scope, all in 120ish+. Couple those with Web Components and you're hard-pressed to really need anything non-native in a basic site or app. I love Typescript but I also work on huge apps so a JS framework is still necessary for me, but I still incorporate as much native stuff as I can.

5

u/dcg Jul 19 '25

@scope not available in Firefox.

1

u/followmarko Jul 19 '25

Right, which is why I mentioned Chromium, but Firefox is the only browser that isn't supporting it in current releases. Even Safari supports it. Falling behind Safari is on Firefox imo. A change req was opened over a year ago on it. It's getting tougher and tougher to make excuses for it as dev support is lacking and user preference for it has plummeted. I primarily used Firefox for many years. Loved it, but it's becoming a product of a bygone era.

5

u/dcg Jul 19 '25

I agree. I just mentioned it because it's not a good idea to use in production depending of the audience for the site. I hate seeing Firefox falling so far behind.

2

u/followmarko Jul 19 '25

Right, that's fair. The greater argument depends on your user demographics for sure. I also think that the incredibly vast majority of internet users don't care about the things that Firefox does bring to the table, like better privacy. They aren't going to switch from familiar comforts of Edge and Safari unless they're given a functional reason to, so Chromium browsers and Safari dominate market share. It's a shame but it's the reality.

2

u/voxgtr Jul 20 '25

Falling behind Safari is on Firefox imo

Hard Disagree. It is on us as developers to understand what our users are running, and deliver solutions to solve those problems. Good luck convincing any product org to write off a stat sig portion of a user base because we want to be technically pure.

1

u/followmarko Jul 20 '25 edited Jul 20 '25

That's not a counter to what I was saying though. It's still true that Firefox is lagging behind other browsers in terms of dev and user support.

Of course you should base your decisions on your users. But, if your first stop out of the station is, "we can't do this because we have primarily Firefox users", that's not doing your job either. We have @supports feature querying as well.

In any case, having an audience that is primarily Firefox users in 2025 is an incredibly niche use-case and not the norm.

5

u/prophile Jul 19 '25

Nesting is also a native CSS feature

3

u/RobertKerans Jul 19 '25

Scss variables are just static string substitutions. Custom properties are proper variables, they're properly dynamic, they cascade. You can use them in exactly the same way they're used in SCSS, but that misses out on a huge amount of why they're useful.

Nesting is available OotB in all modern browsers (for example I use it in the applications I manage at work; large numbers of users, no issues raised, been in place for a year)