Classless.css is one small CSS file, which defines few but great styles for basic HTML5 tags plus a few classes for grid and spacing. Nothing more. Nothing less.
Demo: at classless.de
- Small. Only 400 lines of pure CSS3 for tooltips, grid, navigation bar, cards and more.
- Single File. Everything in one file, no dependencies¹, no JavaScript.
- Modular. Don't need all features? The CSS file is structured into feature groups, simply delete what you don't need².
- Responsive. We use media queries, em/rem units, and smart overflows for tables and code.
- Bootstrap Compatible. Special features that require classes use the same names as Bootstrap.
¹: we import the font 'Open Sans' but if it fails, we fallback to Helvetica.
²: we also offer a pre-made tiny version (90 lines) with only the base styles.
For testing, you can simply insert the following line into your HTML file. For production, please host the classless.css file yourself.
<link rel="stylesheet" href="https://classless.de/classless.css">
| Classless | Skeleton | Milligram | Sakura | |
|---|---|---|---|---|
| Features | responsive, grid, themes, navbar, cards, utilities |
responsive, grid |
responsive, grid, utilities |
responsive |
| Size | 11.2 kB 400 LOC |
11.2 kB 400 LOC |
10.3 kB 600 LOC |
3.3 kB 165 LOC |
| Reset | tiny reset | normalize | normalize | normalize |
| Browsers | Chrome, FF, Edge |
Chrome, FF | Chrome, FF, Opera Edge, Safari |
Chrome, FF |
| License | MIT | MIT | MIT | MIT |
| Browser | Support v94 | Support v95 |
|---|---|---|
| Chromium 87.0 on Ubuntu 18.04 | perfect | perfect |
| Chromium 92.0 on Ubuntu 20.04 | -- | perfect |
| FireFox 85.0 on Ubuntu 18.04 | perfect | perfect |
| FireFox 91.0 on Ubuntu 20.04 | -- | perfect |
| FireFox 84.0 on Windows 10 | perfect | perfect |
| Edge 42.17 on Windows 10 | good¹ | -- |
| Edge 88.0 on Windows 10 | perfect | perfect |
| IE 11 on Windows 10 | poor/good² | poor/good² |
| FireFox 85.1 on Android 10 | perfect | perfect |
| Samsung Browser on Android 10 | perfect | perfect |
| Safari on iPhone 10 | perfect | -- |
¹: drop letter slightly below baseline, citations slightly too high
²: Classless-full: body full width, table and code styles ignored, cite elements overlap text. However, classless-tiny without variables looks good.