top | item 47033472

(no title)

mb2100 | 13 days ago

If everything in your code is a React component, I get why you would just want to write the styles right there.[0] Then again, why write `<Button>` if you could just write `<button>` and style it with standard CSS.

[0]: https://mastrojs.github.io/blog/2025-11-27-why-not-just-use-...

discuss

order

ggregoire|13 days ago

> If everything in your code is a React component, I get why you would just want to write the styles right there.

Even for keeping the style close to the component, you can just use standard css.

Create a folder Button, create two files Button.tsx and Button.css in that folder, import the css file in the tsx file, add a class "button" on the first element the tsx file renders, start all the rules in the css file with ".button " to encapsulate the style.

People will say it's too much work, but it took me like 5 sec.

mb2100|13 days ago

if you're not using CSS modules, why would you import the css file into your javascript? But anyway, I think we agree. Feel free to read the linked blog post ;-)

rafark|13 days ago

Because button is literally anything clickable. Not everything is a boxed button. You cannot just globally add a style to <buttton> and call it a day. For example, an upvote (^) button, a close (x) button, etc. A lot of clickable elements aren’t inside a [click me] box

mb2100|13 days ago

button, .button { /* my button styles */ }

skeptic_ai|13 days ago

What if you need 3 levels of html tags?