100 words 033

Charlotte came up with a nifty trick that combines two different techniques she’s been working with.

The first building block is the pattern of using checkboxes, labels, and the :checked pseudo-class to create progressive disclosure toggles without JavaScript. There’s just one caveat with that technique though—the item being toggled must appear after the trigger label in the source order of the markup.

Enter the second building block: flexbox. With flexbox, we’re no longer at the mercy of the source order in our markup. By using flex-direction: column-reverse, the progressive disclosure trigger can be displayed after the item being toggled.

Have you published a response to this? :

Previously on this day

13 years ago I wrote Conditionally loading content

Conditional loading is a great technique for responsive designs but we need a better way of communicating between CSS and JavaScript.

18 years ago I wrote Web 2.0 Expover

It was the best of times, it was the worst of times.

20 years ago I wrote All of me

Warning: this is going to be meta-writing. I’m going to blog about blogging.

22 years ago I wrote Sci-fi skin

I’ve been laid up with a nasty cold since yesterday, probably due to the schizophrenic moodswings in the weather lately.

23 years ago I wrote dooce.com : bootylicious since 2001

Another one bites the dust. Heather Hamilton will no longer be updating her website.