Articles Tagged tables

You can't position: sticky; a <thead></thead>. Nor a <tr></tr>. But you can sticky a <th></th>, which means you can make sticky headers inside a regular ol' <table></table>. This is tricky stuff, because if you didn't know this weird quirk, it would be hard to blame you. It makes way more sense to sticky a parent element like the table header rather than each individiaul element in a row. … Read article

How do you make a spreadsheet-like interface responsive without the use of any JavaScript? This is the question I've been asking myself all week as I've been working on a new project and trying to figure out how to make the simplest spreadsheet possible. I wanted to avoid using a framework and instead, I decided to experiment with some new properties in order to use nothing but a light touch of CSS.… Read article

The Media Object pattern is: image thingy on the left, heading and text on the right.

That's what Nicole Sullivan called it and the name stuck. It's a pretty simple pattern, but like all things web design, it can be done many ways.… Read article

You know, like a tic-tac-toe board. I was just pondering how to do this the other day, as one does. There are three ways I can think of. One involves a good handful of rules and is the way I intuitively think of, one involves a deprecated attribute, and one is very simple and feels kinda like a CSS trick.… Read article

The border-collapse property is great for making borders even all around <table></table> cells. It makes for a clean look that I actually prefer.

But, there is something that can cause issues with how a browser draws the cells and their respective borders. … Read article