Search
CSS “decorations”
22.11.2021
A reader wrote to me the other day asking about this bit of CSS they came across in Wikipedia’s Common.css:
.mw-collapsible-leftside-toggle .mw-collapsible-toggle {
/* @noflip */
float: left;
/* @noflip */
text-align: left;
}
What’s that @noflip business? That’s...
Body Toggle
6.7.2021
I appreciate the clarity of this trick that Mikael Ainalem posted over on Reddit:
It’s a one-liner that toggles the class on the <body> so you can mock up different states and toggle between them on click.
<body onclick="this.classList.toggle("active");"
Could …
The post...
Little Tip: Draw Your Grid in ASCII in Your CSS Comments for Quick Reference
9.7.2018
Say you declared a grid like this:
body {
display: grid;
grid-template-columns: min-content 1fr;
grid-template-rows: min-content auto min-content;
}
This depends on content, for sure, but how it's likely to play out is like this:
+---+-------------+
| | |
|...