Kevin Marks
You may be joking, but look at twitter and medium’s css http://www.kevinmarks.com/u-means-style.html
marmelab/universal.css: The only CSS you will ever need
Ensure that your class names never go out of sync with your style declarations with this one simple trick:
Take any CSS rule you want to apply, replace : by -, and dots by -dot-, and you get the name of the corresponding universal css classname.
The only thing missing is immutability, so I would suggest also putting !important after each declaration in the CSS. Voila! No more specificity battles.
Responses
Related links
Dear Developer, The Web Isn’t About You | sonniesedge.co.uk
This is absolutely brilliant!
Forgive my excitement, but this transcript of Charlie’s talk is so, so good—an equal mix of history and practical advice. Once you’ve read it, share it. I want everyone to have the pleasure of reading this inspiring piece!
It is this flirty declarative nature makes HTML so incredibly robust. Just look at this video. It shows me pulling chunks out of the Amazon homepage as I browse it, while the page continues to run.
Let’s just stop and think about that, because we take it for granted. I’m pulling chunks of code out of a running computer application, AND IT IS STILL WORKING.
Just how… INCREDIBLE is that? Can you imagine pulling random chunks of code out of the memory of your iPhone or Windows laptop, and still expecting it to work? Of course not! But with HTML, it’s a given.
Lowering the specificity of multiple rules at once - Manuel Matuzovic
This is clever, and seems obvious in hindsight: use an anonymous @layer for your CSS reset rules!
A Friendly Introduction to SVG • Josh W. Comeau
A fantastic explanation of the building blocks of SVG, illustrated—as always—with Josh’s interactive examples.
Kelp
A UI library for people who love HTML, powered by modern CSS and Web Components.
Matthias Ott – Painting With the Web – beyond tellerrand Düsseldorf 20025 - YouTube
A great talk by Matthias on what you can do with web standards today!
Related posts
Ubiquity and consistency
Under-engineering, over-engineering, wombling free.
Underlines and line height
How to make the distance of link underlines proportional to the line height of the text.
Style your underlines
Make your links beautiful and accessible.
CSS snippets
Some styles I re-use when I’m programming with CSS.
Progressive disclosure defaults
If you’re going to toggle the display of content with CSS, make sure the more complex selector does the hiding, not the showing.