Old CSS, new CSS

Avatar of Robin Rendle
Robin Rendle on

I love this post that walks through the development of CSS and HTML — it shows just how far web design has come and how much easier it is for us all now.

Eevee looks at designing websites with tables, the Space Jam website, and how for centuries there was no way to easily inspect changes made to a webpage:

Notice the extremely precise positioning of these navigation links. This feat was accomplished the same way everyone did everything in 1996: with tables.

In fact, tables have one functional advantage over CSS for layout, which was very important in those days, and not only because CSS didn’t exist yet. You see, you can ctrl-click to select a table cell and even drag around to select all of them, which shows you how the cells are arranged and functions as a super retro layout debugger. This was great because the first meaningful web debug tool, Firebug, wasn’t released until 2006 — a whole decade later!

This makes me realize two things. First, I cannot imagine a greater horror than this. And secondly, we’re so lucky to have all the excellent DevTools options that modern day browsers have. One example: I recently remembered that if you see a little grid icon next to some CSS or HTML in Firefox, then you can click it and see the Grid outlines appear:

I think we probably take all of this for granted in our day-to-day lives now but this has me thinking: what are some ways we’ll look back at our work today and be like WHAT! You had to do that thing with XYZ??!?

Direct Link →