Today I learned...

Quick bits of CSS, a pernickity way JS works, an important new way to think about HTML…if you didn’t know before today, there are probably other people here who want to learn it too!

I’ll start the topic off:

A tiny modern CSS progressive enhancement is the use of text-wrap: pretty which prevents typography “orphans” by evaluating the last four lines in a text block and makes adjustments so the last line has two or more words.

Learned from SmolCSS. I’ll be using that one immediately!

3 Likes

FYI, text-wrap: pretty is not supported in Mozilla Firefox or Apple Safari.

1 Like

today I learned not one but two useful things about text:pretty! XD

The future is re-writing text with an LLM so it lines up nicely.

TIL I learned about ~/.bash_logout, a shell script that runs just before you log out on a MEWNIX system that uses the bash shell.

i just learned about the CSS pseudoclass :focus-within !

there’s a dropdown menu on one of my pages that was broken with keyboard navigation, but this fixes it :+1:

2 Likes

the other day i learned about the popover html element! fantastic! gonna use this so much hahaha.

1 Like

oh NICE, I’m well proud of the code I use (on several of my sites) to do this, but a whole html element for it, that’s so useful.

Not as pretty (sorry) but better supported: CSS text-wrap: balance | Can I use... Support tables for HTML5, CSS3, etc

Particularlly useful for headlines.

1 Like

Something cool I learned today is using filter() to change the color of an SVG. Which is super useful for a project I’m following along with as the icons it was using were white and the ones I was using were black. I’m trying to make things match to learn a little extra. It makes sense that this is possible since an SVG is code making an image, but I thought it was pretty neat when I learned it.

Here’s some resources about this:

How I learned about filter()

A handy website to generate the needed filter() from the hex color you wish to change the SVG to.

https://isotropic.co/tool/hex-color-to-css-filter/

1 Like

A few days ago I learned that I could shift+tab a highlighted section of code to unindent it a step.

I had been tabbing many lines at once easily, but felt frustrated that I had to backspace the beginning of each line if I wanted to unindent a block of code. Turns out I was just doing it the hard way for no reason other than ignorance :sob:

2 Likes

this is a small thing, but today i learned about <colgroup>! i use tables sparingly, but this has proven to be useful: mdn

1 Like