Skip to main content
CSS is fun and cool and I like it.
Article

The Anatomy of a Tablist Component in Vanilla JavaScript Versus React

If you follow the undercurrent of the JavaScript community, there seems to be a divide as of late. It goes back over a decade. Really, this sort of strife has always been. Perhaps it is human nature.

Whenever a popular framework gains traction, you inevitably see people comparing it to rivals. I suppose that is to be expected. Everyone has a particular favorite.

Lately, the framework everyone loves (to hate?) is React. You often see it pitted against others … Read article “The Anatomy of a Tablist Component in Vanilla JavaScript Versus React”

Article

Tabs: It’s Complicated™

I’ve said before one quick and powerful thing you can learn as a front-end developer just getting starting with JavaScript is changing classes.… Read article “Tabs: It’s Complicated™”

Almanac

tab-size

The tab-size property in CSS is used to adjust the amount of spaces that display for the tab character.

pre {
  tab-size: 8; /* default. Pretty big! */

  tab-size: 2;
  tab-size: 13px; /* you can set a width-per-tab also */
}

Have a play with these range sliders to see how different values effect how tabs render (when you can actually see tabs):

See the Pen
rNBLYaP
by Chris Coyier (@chriscoyier)
on CodePen.

The tab character (unicode … Read article “tab-size”

Article

Organic Tabs

Have you ever seen a tabbed content area in a sidebar that was a little “jerky”? The jerkiness can be caused by a bunch of things, like the content in the tabbed areas are of different heights, or maybe the way the switch happens the current one is hidden for a brief second before the new one shows up and the content below it jumps up and back down quickly. For lack of a better term, I’m calling tabs that … Read article “Organic Tabs”