If you’re going to suggest public CDN usage (tho should be discouraged), lead by example with best practices & include subresource integrity on <link>.
This is how I thought CSS was supposed to be used when I learned about it 20 years ago. And it was kind of what we were promised. Separate your content from its formatting, they told us. Class and id based rules were always there, but were presented as a solution for disambiguation, should one apply a style to a specific piece of content.
When bootstrap was first released, I really didn’t get the point. Their approach was doing sort of the opposite of what they claim to solve. Drop this in as a good usable presentable style, ok, but do so by polluting every last bit of html of your site? Why did we even departed from setting style attributes on html tags in the first place?
I am glad to see the relatively recent movement of classless CSS stylesheets. I think we need many more. And more variety. They all try to achieve this sober paper like feel. I want to see opinionated aesthetic and features. Basic navigational and layout features such as different menu concepts, or even tooltips, etc.
Classless CSS has been around a long time! What Missing does is combine a classless library with some basic widgets like menus, and a bunch of utility classes for common things so you don’t have to drop into CSS as often.
Edit: I should also mention that you can change CSS variables to customize Missing.css.
Class and id based rules were always there, but were presented as a solution for disambiguation, should one apply a style to a specific piece of content.
I think that’s true for id, but I always assumed class was meant to provide semantic information that wasn’t expressed in the HTML tags directory and in a way that composed (a single run can have multiple classes but it is cdata for a single HTML element). For example, this div is an article (HTML5 added a tag for this), this div is code and it’s C++ and this span is a keyword. This was still about separating content and presentation. I’d have a rule for code (e.g. monospace, 10pt), add something to the box around the div to tell the reader that it’s C++, and then use the keyword class on the span to style it differently (e.g. red).
For id, the rules were similar but this was for one-off elements where I wanted to guarantee uniqueness.
This mostly seems better in that HTML and CSS (and CSS suppport) have progressed in the 15 years since bootstrap got started: it provides a normalised baseline, better support for HTML5 elements, but then you till have to use a bunch of component, layout and utility classes or even custom elements to achieve more complicated items.
Why did we even departed from setting style attributes on html tags in the first place?
Because that made inconsistency easy. The goal of bootstrap was to make things more consistent by providing a clear set of utilities, layout items, etc… It was also always based on CSS preprocessors so you could not just tweak the values (long before CSS variables were production ready) but also compose your own components via mixins, which would then inherit the global setting values.
Responsivity was also a big factor of bootstrap (it started at Twitter, and mobile use was a major use case of theirs back then already), and responsivity is simply not achievable via style attributes.
I do this a lot as well. It’s technically a slowed selector, but a) I don’t have to come up with a class name and b) it asserts & enforces accessibility.
Might give this a try for my blog, up until now I’ve been using vanilla.css.
I really like the idea of just being able to drop a stylesheet onto your page and not having to apply classes to your html to change the appearance.
Wonder how far you could get with this whole concept. There must be a good reason why this approach isnt more commonplace but as a backend dev I’m not really sure.
If you’re going to suggest public CDN usage (tho should be discouraged), lead by example with best practices & include subresource integrity on
<link>
.This is how I thought CSS was supposed to be used when I learned about it 20 years ago. And it was kind of what we were promised. Separate your content from its formatting, they told us. Class and id based rules were always there, but were presented as a solution for disambiguation, should one apply a style to a specific piece of content.
When bootstrap was first released, I really didn’t get the point. Their approach was doing sort of the opposite of what they claim to solve. Drop this in as a good usable presentable style, ok, but do so by polluting every last bit of html of your site? Why did we even departed from setting style attributes on html tags in the first place?
I am glad to see the relatively recent movement of classless CSS stylesheets. I think we need many more. And more variety. They all try to achieve this sober paper like feel. I want to see opinionated aesthetic and features. Basic navigational and layout features such as different menu concepts, or even tooltips, etc.
And we tried, and we tried, and it never really worked, and now we have Tailwind ;-)
Classless CSS has been around a long time! What Missing does is combine a classless library with some basic widgets like menus, and a bunch of utility classes for common things so you don’t have to drop into CSS as often.
Edit: I should also mention that you can change CSS variables to customize Missing.css.
I think that’s true for id, but I always assumed class was meant to provide semantic information that wasn’t expressed in the HTML tags directory and in a way that composed (a single run can have multiple classes but it is cdata for a single HTML element). For example, this div is an article (HTML5 added a tag for this), this div is code and it’s C++ and this span is a keyword. This was still about separating content and presentation. I’d have a rule for code (e.g. monospace, 10pt), add something to the box around the div to tell the reader that it’s C++, and then use the keyword class on the span to style it differently (e.g. red).
For id, the rules were similar but this was for one-off elements where I wanted to guarantee uniqueness.
This mostly seems better in that HTML and CSS (and CSS suppport) have progressed in the 15 years since bootstrap got started: it provides a normalised baseline, better support for HTML5 elements, but then you till have to use a bunch of component, layout and utility classes or even custom elements to achieve more complicated items.
Because that made inconsistency easy. The goal of bootstrap was to make things more consistent by providing a clear set of utilities, layout items, etc… It was also always based on CSS preprocessors so you could not just tweak the values (long before CSS variables were production ready) but also compose your own components via mixins, which would then inherit the global setting values.
Responsivity was also a big factor of bootstrap (it started at Twitter, and mobile use was a major use case of theirs back then already), and responsivity is simply not achievable via style attributes.
Related and other meta lists https://lobste.rs/s/rombme/bolt_css_another_classless_css_library
I really like the usage of ARIA roles for styling and thus getting accessibility for free.
I do this a lot as well. It’s technically a slowed selector, but a) I don’t have to come up with a class name and b) it asserts & enforces accessibility.
Wonderful documentation! I appreciate the index page too.
mkws theme
This looks great. I’ve got an old CRUD project I’m thinking of migrating to a classless (or minimalist) CSS stylesheet.
One thing - I can’t get
<dl>
etc to show in the playgroundMight give this a try for my blog, up until now I’ve been using vanilla.css.
I really like the idea of just being able to drop a stylesheet onto your page and not having to apply classes to your html to change the appearance.
Wonder how far you could get with this whole concept. There must be a good reason why this approach isnt more commonplace but as a backend dev I’m not really sure.
I actually really like a lot of the decisions made with this library. Everything feels nice and clean and obvious.
Thanks! I wanted to avoid the tailwind-landing-page-template.jpeg aesthetic and focus on high-content websites.