* {
all: unset;
}
But then you’d have to reimplement everything from browser defaults, which can get a bit tedious.I agree, it would be nice to get a bit of a cleaned up set of defaults though, and you could polyfill it this way.
Perhaps connectivity became so good that now as long as it works on evergreen, it’s good to go. We used to put a lot of effort into this stuff, but it feels like it’s been years since we even thought about it.
More details here: https://getbootstrap.com/docs/5.3/content/reboot/
Code: https://github.com/twbs/bootstrap/blob/v5.3.8/dist/css/boots...
The better-known normalize.css is https://github.com/necolas/normalize.css. It was last touched seven years ago.
There’s a reason neither has seen more recent activity: they were mostly about making old browsers behave themselves, and they’re done. The stylesheets did have a little more to them, but it wasn’t what people actually cared about… and in some cases they were better off without them. I know I disagree with quite a few of their opinionated styles.
Those old browsers are now long obsolete—half of them can’t even talk TLS 1.2, which basically excludes them from the modern web—so almost all of these stylesheets is obsolete, and you don’t need them.
For the few pieces that might still have value, you would now prefer to use @layer or :where() for this kind of stylesheet, to make them behave more like user agent styles and avoid specificity conflicts.
There may be some rules you want to change in a set of baseline rules such as margin/padding, image sizing, and fonts. But those would be things you would add on top of normalize.css anyway.
[1] https://html.spec.whatwg.org/multipage/rendering.html#render...
Instead, we'd just set elements to what we wanted them to be which is what we'd have to do in most cases anyway, making any reset unnecessary.
No, a browser's defaults are, well, its defaults. One doesn't reset to them.
I think the line between a normalizer and reset stylesheet is _very_ fine, if there even is a line. A normalizer is probably _slightly_ more opinionated than a reset stylesheet. In the end, the difference isn't really important. If you need a reset stylesheet, normalizer will probably do just as well.
- CSS reset - completely reset all browser styles to be blank essentially, across different browsers, so then you'll build your styling on common ground
- CSS normalize - same idea of resetting to a baseline, but keeping some of the default styling but still make it consistent across browsers, so not stripping away everything
[1]: https://github.com/tailwindlabs/tailwindcss/blob/main/packag...
I am an amateur dev (I write open-source useful for me and possibly others) and I am prone to the "front-end diarrhea syndrome", where when I see something cooler, I jump on it and regret afterwards the time spent.
I am on TailwindCSS right now and I am afraid to learn the drawbacks, but one must be courageous in life.
This is a pretty good post.
In general, I don't think `class` is a good place for styling.
That said, for learning the "right" way to think about and use CSS, https://every-layout.dev is hands-down the best resource I've encountered in my 20+ years working with websites.
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Reset the default border style to a 1px solid border.
*/
hr {
height: 0; /* 1 */
color: inherit; /* 2 */
border-top-width: 1px; /* 3 */
}
Why can’t they do anything reasonably? It would be easy to put code comments against the actual code it is commenting, but instead they do this weird comment index up front.My take on Normalize.css is how something so simple can have such a huge impact. It's astonishing.
Here’s mine[1] which I wrote while working on multilingual projects involving both Latin and non-Latin languages.
[1] https://github.com/Microflash/preset/blob/main/src/preset.cs...
reconnecting•9h ago
Leftium•8h ago
Brief history/explanation from: https://github.com/csstools/normalize.css/#differences-from-...
> Nicolas Gallagher and I started writing normalize.css together. I named and created the normalize.css repository with the help of Paul Irish and Ben Alman. I transferred the repository to Nicolas, who turned it into a “household” CSS library.
> Later, I resumed authorship of normalize.css with Luciano Battagliero. Together, we tagged, deprecated, and removed “opinionated” styles — styles developers often prefer but which do not fix bugs or “normalize” browser differences.
> Later, Nicolas resumed authorship and the issue of whether to include or omit the opinionated styles forced us to split.
Leftium•8h ago
Used here: https://github.com/Leftium/news/blob/0d507aecd05dfe94853d278...